アコーディオンは、FAQなど、限られたスペース内に似た目的のコンテンツをまとめるのに最適です。
または、クイズの回答など、初期状態では隠しておきたいコンテンツに対して使うこともあります。
WordPressの公式レポジトリには、アコーディンオン単体の機能を持たせたプラグインも多くありますが、最近では、列やボタン、タブ付き領域の作成など、他の多くの機能のうちの1つとしてアコーディオンの作成機能を実装してくれるプラグインもあります。
多機能なプラグインは便利ですが、その分システムは重くなりがちなので、これから紹介するプラグインのなかから、目的に合ったプラグインを選ぶと良いでしょう。
Squelch Tabs and Accordions Shortcodes
Squelch Tabs and Accordions Shortcodesは、アコーディオンとタブ付きコンテンツの両方のショートコードを提供します。 また、他のプラグインにはない水平オプションと垂直オプションの両方を提供します。
このプラグインには多くのデザインが用意されているため、自分おサイトに合ったデザインでアコーディオンを実装するためのハードも低いです。
- 折りたたみ可能なアコーディオンとタブ(水平・垂直)
- カスタマイズされたスタイリング
- コンテンツの分離
- 24個のjQueryUIを用いたデザイン
- 独自のデザインを作成することもできます。
Squelch Tabs and Accordions Shortcode
Accordion
AccordionもFAQの作成に便利なアコーディオンとタブを提供してくれるプラグインです。
サイトの色やフォントサイズに合わせて見た目をカスタマイズするオプションが用意されており、作成可能なアコーディオンとタブに制限はありません。
そして、ショートコードによる表示にも対応しています。
- ショートコード対応
- 遅延読み込み
- レスポンシブ対応のアコーディオンとタブ
- カスタムアイコンの適用
- その他…
Accordion
Shortcodes Ultimate
Shortcodes Ultimateには、アコーディオンやタブだけでなく、他にもボタンなど50を超える異なる機能が提供されていおり、それらをショートコードを使って表示します。
また、記事編集画面に専用のポップアップメニューが用意されているため、ショートコードの挿入が非常に簡単です。
- 50以上のショートコード
- ライブプレビュー
- Gutenberg エディターに対応済¥
Shortcodes Ultimate?
Tabs
Tabsプラグインを使用すると、水平タブと垂直タブの両方を使用できます。
このプラグインは、タブの説明フィールド内にテキスト以外の情報(画像、ビデオ、音楽、または別のショートコード)を記入できるようにしてくれており、使い勝手は通常のエディターと同じです。
また、配色とフォントをカスタマイズすることもできます。
- レスポンシブ対応
- ドラッグアンドドロップビルダーAPI
- タブにアイコンのみを表示
Tabs?
Accordion FAQ
Accordion FAQは、アコーディオン特化型のプラグインです。アコーディオンしか使えない代わりにかなり豊富なカスタマイズオプションを持っています。
本ページを検索結果から来た方はアコーディオン目当てだと思いますので、最低限な機能を備えたこちらがおすすめです。
もちろん、他のプラグインのアコーディオン以外の機能を使う予定があるのであれば、他のプラグインもありです。
ドラッグアンドドロップビルダーを使用して、バックエンドでアコーディオンの位置を簡単に並べ替えることができます。 また、レスポンシブ対応していて高度にカスタマイズ可能なフロントエンドを提供します。
そして、個人的はBootStrapベースなのが大変嬉しいです。当サイトもBootStrapのGridシステムを使って設計しており、親和性が高いためです。
- レスポンシブデザイン
- ショートコードでの表示
- Bootstrapベース
Accordion FAQ
多くの場合、これらのいずれかのプラグインでアコーディオンを簡単に導入できると思います。
アコーディオの実装はめんどくさくて、時間のロスになることが多いので、これば無料で切るのはWordPressコミュニティーの凄いところですね。