2015.05.21 こちらのFAQ Managerプラグインの更新が止まっているので代替プラグインを紹介します!
Flexible FAQ について
CSSの追加方法について、記事を更新しました!
>>「FAQ manager」のデザインをCSSでカスタマイズ!
WordPressでFAQ、Q&A、「よくある質問」などを管理するならオススメのプラグインがあります。
カスタム投稿形式で増やしていけるので、自分での更新はもちろん、クライアントにも嬉しい作りですね。
さらに、カテゴリやタグで分けることができ、それぞれをショートコードで個別に表示できるので大変便利!
jQueryを利用した折りたたみ(アコーディオン)の効果もデフォルトで備えています。
導入事例はこちら!CSSを追加すれば、このようなデザインにすることも可能です。
目次
FAQ Managerのインストール
- プラグイン名
- FAQ Manager
- プラグインサイト
- [browser-shot width=”600″ url=”http://wordpress.org/plugins/wordpress-faq-manager/faq/”]
プラグイン>新規追加>FAQ Manager を検索 有効化します。
メニューに「FAQs」が追加されますので、投稿をするような感じでFAQを追加していけます。
今回は
・カテゴリ(faq topics)を設定し、アコーディオンでタイトルと内容を出力する
・ページ遷移はさせない(FAQの個別ページやアーカイブは特に設けない)
という条件でいきます。
FAQs > setting で初期設定
表示オプション
paginateに関しては表示項目数を設定している際にページナビを実装できるようですが、あまり思ったとおりの動きをしてくれませんでしたね。。
タイトルをクリックして内容をアコーディオン表示にする際は
Include jQuery collapse / expand
にチェックを入れましょう。
デフォルトCSSはマージンやタイトルのカーソル表示等、最低限のものなのでチェックしておきます。
Content Options
ソーシャルブックマークの表示プラグイン、関連記事のプラグインなどを利用している場合、アコーディオンで表示したときにそれらも表示されてしまうという・・・残念な感じに。。
Disable content filter ・・・ にチェックすると回避できました。
RSSfeedに関しては・・・ちょっとよくわからなかったのでそのままにしています。
Redirectは、FAQ manageで作った記事ページやアーカイブを、特定の個別ページにリダイレクトさせる設定にできます。特に個別ページやアーカイブを作りたくなかったので、リンクができてもFAQの個別ページにリダイレクトされるようにしました。
質問タイトルの一覧を出して、それぞれのFAQ記事に遷移させたい場合はチェックしちゃいけませんよ!
SEO Options
FAQに関連する記事ページやアーカイブは特に作りたくないので、SEO的にもGoogleさんにインデックスさせないような設定にしました。
その他
カスタム投稿の形式で追加するので、
だいたいこんな感じで使えます。
カテゴリーがtopicsになったと思えばOKです!
個別の記事ですが、スラッグがそのままHTMLにIDとして追加されるので、日本語だと大変なことになります。ID=”制作実績について” とかになるので(笑
topics を決めたら、記事のスラッグはそれに連番をつける形で統一しました。
topics : works
記事のスラッグ : works01,worcs02,works03 ・・・ って感じで。
あとはFAQのページに出力しましたのでご確認下さい!
ショートコードはこちら!
[[faq faq_topic=”qa_create” limit=”-1″]]
[[faq faq_topic=”qa_works” limit=”-1″]]
FAQs > instruction で、ショートコードも色々な形式があるのを確認できます。
今回の条件では、topics(FAQsのカテゴリ)を指定し、表示数の制限は無し(-1)にしています。
あとは、CSS等で装飾してあげれば、冒頭でご紹介したようなデザイン変更が可能です!