Q&Aのページを簡単にきれいに更新できるようにするプラグインFlexible FAQ

昨日のことですがコワーキングスペース8Beatの「よくある質問」ページが更新されたというお知らせを見て、どれどれ…と見に行ったところ、ちょっと見づらいなぁ…と思いました。
以前からQ&A(もしくはfaq)のプラグインに興味があって使ってみたいなと思っていたのでこの機会にプラグインをいれてページをきれいにしてみました(^^)/

8Beatでは会員様は1日100枚まで印刷無料!というお知らせ(^^)/

それは、

というすばらしいお知らせでした(^^)/。これは月額会員になるメリットが大きいですよね!

サイトを見てみると、

うーん、残念。画像の周りの文字回り込みや、改行がうまくいってないところがあります。

固定ページで書いているのですが、こういうQ&Aページは追加や削除が多くあると思うので、プラグインを利用した方が使い勝手が良いと思われます。ということでプラグインを入れる事にしました。

Q&A(faq)プラグインはたくさんありすぎて、その中からFlexible FAQを選んだ訳

ダッシュボード プラグイン>新規追加 で faq を検索してみると、

こんな感じで、2,380個もプラグインがあるようです。

WordPress faq プラグイン でググると良く出てくる faq Manager もあるのですが、

最終更新が3年前というところが気になります。そこで、他にないのか探して、

FAQ manager の更新が止まってるので代替プラグインを探してみました。こっちの方がオススメ! Flexible FAQ

こちらの記事を見つけました。

今時点だと1年以上更新していないということですが、まぁ3年前よりいいし、記事を見たときに折りたたみで表示するデザインが気に入ったのでこのプラグインを使うことにしました。

Flexible FAQ のインストール

ダッシュボード プラグイン>新規追加 で Flexible FAQ と入力して検索し、



今すぐインストール
をクリック。

プラグインを有効化 をクリック。これでインストール終了です。

Q&Aの記事を入力する

ダッシュボード に新しくできたメニュー FAQ をクリック

投稿や固定ページのように記事が書けそうです。ここではQ&Aの1組ごとに1つの記事を書いていきます。

新規追加 をクリック

こんな感じに普通に記事を書きます。公開 をクリック

この記事を普通に表示すると

普通の投稿ページのように見えます。Q&Aのページでどのように表示されるかを確認するには

新しく固定ページを作って、

こんな風に 

とだけ入力します。これを表示すると、

先ほど FAQ で追加した記事のタイトルだけ表示されています。

+ をクリック

質問に対する答えが表示されました。このデザインが良いなーと思ってFlexible FAQを使おうと思いました。

FAQで記事をどんどん追加します。そして先ほどの よくある質問 ページを見ると

追加したQ&Aの一覧が表示されました!これでQ&Aページの作成は終了です。

ここで一つ注意があるのですが

を入力して表示するページのスラッグには決して faq という名前を付けてはいけません(^_^;。すでにそのスラッグを使っていたら変更しておいてください。このFlexible FAQプラグイン faq というスラッグを使うので同じスラッグを使ってしまうと表示が、

こんな感じになって「え~!なんで~なんで~さっきまでうまく表示されていたのに…(頭混乱)」となります(実話)。

追加したQ&Aのページをメニューに追加する

追加したQ&Aのページをメニューに追加します。

ダッシュボード 外観>メニュー をクリック

今回の場合、置き換えなので先に現在のメニューにある よくある質問 を削除します。

左側固定ページにある 新しく作った よくある質問 にチェックを入れて メニューに追加 をクリック

右側のメニュー一番下に追加されました。これを先ほどの位置にクリックしてドラッグ



ドロップ
します。

忘れずに右下の メニューを保存 をクリック

表画面のメニューで、

今追加した よくある質問 をクリックすると、

Flexible FAQ で作った新しい よくある質問 ページが表示されました(^^)/

まとめ:Flexible FAQを使うとかんたんにかわいいQ&Aページができる

こんな感じで簡単にQ&Aページを作ることができました(^^)/

表示方法は他に

list という指定で、

こんな感じになったり、

block という指定で

こんな感じになったりします。

他にカテゴリー別に表示させたり、CSSを追加して色などをカスタマイズすることもできるようです。それについてはまた機会があったら書いてみたいと思います(^^)/。

[Amazon sponsored link] WordPressデザイン 関連本
兎本美佳

ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/
無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
ゆうそうとITブログはMIXHOSTで運営中
スポンサー広告
ブログをメールで購読

メールアドレスを記入して購読すれば、更新をメールで受信できます。

280人の購読者に加わりましょう

コメント

  1. […] Q&Aのページを簡単にきれいに更新できるようにするプラグインFlexible FAQ […]

  2. せぶん より:

    検索結果を[faq]で表示したときの [+] [-] のように表示することは簡単にできるものなのでしょうか?
    もしご存知でしたら教えていただけると助かります。

    • 兎本美佳 兎本美佳 より:

      せぶんさん、こんにちは。コメントありがとうございます。質問の内容がよくわからないのですが、WordPressに付属している「検索ウィジェット」の結果を、タイトルをクリックしたら中身が表示されるというようなカスタマイズですかね?おそらくJQueryかCSSでできるかも?と思いますが、もしできるようならブログに書いてみますが、できるかどうかちょっと今時点では不明です。

  3. […] スマートにQ&Aを作りたい場合は、「Flexible FAQ」や「Arconix FAQ」といったプラグインを使ってみるのもいいでしょう。 […]

トップへ戻る

ゆうそうとについての説明

ゆうそうと とは東京都八王子市を中心として、WordPressによるWEBサイトの作成や、スポットでのIT相談を行ったり、年間契約でのIT顧問をなりわいとして活動しています。

特徴としては30年以上IT業界でプログラムを中心として仕事をしてきたものと、美大出身のデザイナーがワンストップで対応するため、幅広い対応が可能であることです。

IT相談は直接お会いしてのご相談の他、ZOOMによるオンライン相談も可能です。