7+ ベスト WordPress アコーディオンプラグイン (2024)

WordPressのサイトデザインで最もよく使う機能のひとつに、アコーディオンがあります。この便利なウェブデザイン要素は、折りたたみ可能なタブレイアウトでコンテンツを表示できるため、スペースを取らずによくある質問や商品の詳細を表示することができます。

個人的には、SeedProdのアコーディオンブロックを使うのが好きです。とはいえ、ユーザーにはそれぞれ好みがありますし、もしかしたらページビルダーのソリューションではなく、専用のアコーディオン・プラグインを探しているかもしれません。

もしそう思うのなら、あなたは正しい場所にいる。この投稿では、あなたのサイトで使える最高のWordPressアコーディオン・プラグインを紹介します。

WordPressアコーディオン・プラグインのベストセレクション

	Name	Pro	Con
🥇	Heroic FAQs	Easy-to-customize accordions for FAQ content	Must be purchased with Heroic KB
🥈	SeedProd	Comprehensive customization options for accordion design	Accordion block not available in free version
🥉	PickPlugins’ Accordions	Lazy loading feature to optimize accordions	Interface is not the most user-friendly
4	Thrive Architect	Advanced settings for accordion animation	No free version available
5	Ultimate Blocks	SEO-friendly with customizable heading tags	Limited accordion icon options
6	Easy Accordion	Built-in support for WooCommerce product pages	Best features locked in Pro version
7	Accordion FAQ	User-friendly drag-and-drop accordion editor	Free version displays multiple ads

WordPressに最適なアコーディオン・プラグインのテスト方法

最高のWordPressアコーディオン・プラグインを見つけるために、私たちは単純にそれぞれのプラグインをデモサイトにインストーラし、それぞれのプラグインがどのような位置づけにあるかを評価しました。

しかし、それだけではありません。私たちは、プラグインがいかに簡単に使えるかにも重点を置いた。インストールしてすぐに簡単に設定できないアコーディオン・プラグインにはまりたくはないでしょう。

また、カスタマイザー機能にも注目した。すべてのアコーディオン・プラグインが同じように作られているわけではありません。しかし理想を言えば、FAQセクションを作るにせよ、何か違うものを作るにせよ、アコーディオンの見え方を簡単に変更できるものがいいでしょう。

それ以外には、プラグインのパフォーマンステストを試みた。プラグインはWordPressホスティングのスペースを占有する可能性があり、アコーディオン機能はそもそもそれほど重くないのが普通だ。それでも、使用するプラグインがサイトを遅くしないことを確認するのは良いことだ。

最後に、価格とコストパフォーマンスを見た。このリストに掲載されているプラグインの中には有料のものもあるので、価格によってどのような特典が得られるのか（あるいは得られないのか）について率直にお伝えしたい。

WordPressサイトで使用できる最高のWordPressアコーディオン・プラグインを見てみよう。

1.英雄的FAQ

よくある質問に特化したアコーディオンプラグインを使いたい場合は、Heroic FAQsをチェックしてください。折りたたみ可能なタブ付きコンテンツを簡単に生成し、WordPressブログやサイトの任意の場所に追加することができます。

プラグインをテストしたところ、ドラッグアンドドロップエディターが非常に使いやすいことがわかりました。質問と回答の作成、FAQのグループ化、項目の並び替えが簡単にできます。5つの定義済みアコーディオンスタイルがあり、あなたのサイトデザインに完全に一致させるための多くのカスタマイズオプションがあります。

例えば、画像、ブロッククォート、動画、リストなどのリッチコンテンツをアコーディオンに追加することができます。

Heroic FAQsは、FAQアイコンを15種類から選択でき、アコーディオンやトグルのスタイル設定、CSS3アニメーションなど、FAQをよりパーソナライズするためのオプションも提供しています。

英雄的FAQの長所：

• FAQコンテンツを簡単にカスタマイズできるアコーディオン。
• ユーザーフレンドリーなドラッグ＆ドロップエディターでアコーディオンを構築。
• リッチコンテンツ要素をアコーディオン内に挿入することで、より魅力的なアコーディオンにすることができます。
• ビルトインFAQスキーマサポートにより、FAQコンテンツが検索エンジンに表示されます。

英雄的FAQの短所

• 無料のプラグインはありません。
• Heroic KBと一緒に購入する必要があり、価格は年間149.50ドルから。つまり、このプラグインはアドオンのようなものだ。

Heroic FAQsを選んだ理由 FAQコンテンツに特化した、使いやすいアコーディオンプラグインを探している場合に最適です。また、Heroic KBと一緒に購入する必要があるため、ナレッジベースを構築したい場合にもおすすめです。

2.SeedProd

市場で最高のドラッグアンドドロップWordPressページビルダーとして、SeedProdは、ユーザーフレンドリーなサイトを作成するための様々なブロックを提供しています。これらにはアコーディオンブロックが含まれ、ページ上で展開したり折りたたんだりするテキストセクションを追加することができます。

実際にWPBeginnerでは、いくつかのブランドサイトやカスタムページにSeedProdを使っています。プラグインの機能と利点については、SeedProdのレビューで詳しく説明しています。

SeedProdを使えば、すべてアコーディオンブロックをページにドラッグ＆ドロップするだけで、カスタマイザーを始めることができます。テキストセクションは必要なだけ作成でき、Font Awesomeのユニークなドロップダウンアイコンを使って個性的なタッチにすることもできます。

ブロックのタイポグラフィ、色、アニメーション効果などを自由にカスタマイズして、アコーディオンをよりインタラクティブなものにしましょう。

SeedProdの素晴らしいところは、レスポンシブなアコーディオンを簡単に作れることです。デスクトップ端末とモバイル端末でブロックの間隔を調整したり、特定の端末でページが表示された場合にアコーディオンを非表示にすることもできます。

SeedProdの長所：

• すべてのレベルのユーザーに使いやすいドラッグ＆ドロップエディター。
• カスタマイズ設定オプションにより、ヘッダーやドロップダウンアイコンからテキストセクションのシャドウまで、アコーディオンのデザインを完全にコントロールすることができます。
• モバイルでのアコーディオンの間隔と可視性を調整する設定をプロバイダーとして提供し、ユーザー体験を向上させるのに最適です。
• すぐに使える様々なFAQセクションのレイアウトを提供し、プロセスをスピードアップします。
• カスタムCSSでアコーディオンデザインをよりパーソナライズできます。

SeedProdの短所：

• アコーディオン・ブロックは無料版にはありません。

SeedProdを選んだ理由： アコーディオンブロックはPro版でしか利用できませんが、それでもSeedProdをお勧めする価値はあると思います。カスタマイズ可能なアコーディオンに加え、ユニークなサイトを簡単に作成できるユーザーフレンドリーなページビルダーも利用できます。

3.アコーディオン

私たちがテストしたすべてのプラグインの中で、Accordionsは少し高度なアコーディオンオプションだが、かなり強力なものでもある。

これまでのプラグインとは異なり、WYSIWYGエディターやドラッグ＆ドロップエディターは付属していない。インターフェースはよりシンプルで、ライブプレビューはありませんが、無制限のアコーディオンを追加してカスタマイズするための多くの設定を見ることができます。

このプラグインの最も注目すべき特徴のひとつは、遅延ロード設定である。これは、ユーザーの画面がページ上のアコーディオンに到達するまで、アコーディオンの読み込みを遅らせる。こうすることで、高速なサイトパフォーマンスを維持することができる。

さらに、Proバージョンを入手すれば、ネストしたアコーディオンを作成できる。この機能は、説明したい情報がたくさんあり、より整理したい場合に便利です。

アコーディオンの長所：

• アコーディオンを最適化するための遅延ロード機能があります。
• 他のプラグインからアコーディオンをインポートするためのインポート機能を提供します。

• 伝統的なアコーディオンと垂直タブの2種類から選べるアコーディオン。
• Font Awesomeアイコンとの統合により、アコーディオンを展開または折りたたむ際のアイコンをカスタマイズできます。
• Proプランには、ネストされたアコーディオンやビルトイン検索機能などの高度な機能が含まれています。

アコーディオンの短所：

• インターフェースはユーザーフレンドリーとは言い難い。
• アコーディオンを表示できるのは、ショートコードを使用した場合のみです（アコーディオン用のビルトインブロックはありません）。

Accordionsを選んだ理由 Accordionsは、使い勝手にやや欠けるものの、美しいアコーディオンを作成できる強力なプラグインだ。Proプランには、ネストされたアコーディオンなど、他のプラグインにはない機能も含まれています。詳しくはAccordionsのレビューをご覧ください。

4.Thriveアーキテクト

Thrive Architectはアコーディオン/トグルブロックを備えたもう一つの素晴らしいページビルダーです。ドラッグアンドドロップエディターがあるので、このプラグインでFAQや製品情報セクションをデザインするのは簡単です。さらに詳しく知りたい方は、Thrive Architectのレビューをご覧ください。

Thrive Architectで目を引くのは、トグル・ブロックのアニメーション・スタイルとスピードをカスタマイズできることです。これにより、アコーディオンの動作をよりコントロールすることができます。

その他にも、トグル・ブロックにカラムを作成することができるので、アコーディオン・コンテンツがたくさんある場合に便利です。さらに、トグル・ブロックの背景色、タイポグラフィ、シャドウなどをカスタマイズできる。

訪問者の注意を引くために、初期設定でトグルを展開させたい場合は、それも可能です。最初のアコーディオンのコンテンツだけが表示されるので、拡大によってスペースが制限される心配はありません。

Thrive Architectの長所：

• トグル・ブロックはThrive ArchitectとThrive Suiteのすべてのプランに付属しています。
• ユーザーフレンドリーなドラッグ＆ドロップエディター。
• アコーディオン・ブロックの見た目をカスタマイズする方法はたくさんある。
• アコーディオン・ブロックのアニメーションを設定し、クリック時の動作をコントロールする高度な設定。
• デスクトップ、モバイル、タブレットでトグルを表示または非表示にする設定により、サイトのレスポンシブが向上します。

Thrive Architectの短所：

• 無料版はない。
• 自動保存機能がないので、手動で保存する必要がある。

Thrive Architectを選んだ理由： トグル機能のあるページビルダーを探しているなら、Thrive Architectを試してみよう。アコーディオンを作成するためのカスタマイザー設定は包括的で、このプラグインでユニークなウェブデザインと魅力的なランディングページを簡単に構築することができます。

5.アルティメット・ブロック

Ultimate Blocksは、私たちが試したGutenbergブロックプラグインの中で、アコーディオン機能を備えた最高のプラグインの一つです。このツールについては、Ultimate Blocksのレビューで詳しく説明している。

これを使えば、区切りインターフェースではなく、ブロックエディター上でコンテンツトグル・ブロックを追加することができます。この方法で、FAQセクションを作成し、ページや投稿日の好きな場所に簡単に配置することができます。

Ultimate Blocksの素晴らしいところは、アコーディオンタイトルの見出しタグを選択できることです。その結果、アコーディオンのコンテンツをSEOフレンドリーにして、ページや投稿の論理構造に合わせることができます。

Proバージョンにアップグレードすると、アコーディオンの上部に検索バーを追加することができ、ユーザーが素早く答えを検索できるようになります。

アルティメット・ブロックの長所：

• デスクトップ、タブレット、モバイル端末でアコーディオンを非表示にするレスポンシブ・デザイン・コントロールを提供。
• FAQスキーマのサポートとカスタマイズ可能な見出しタグで、SEOフレンドリー。
• ドラッグ＆ドロップのGutenbergブロックエディターでコンテンツトグル・ブロックを追加できるので使いやすい。
• タブ付きや拡張可能なコンテンツブロックなど、スペースを最小限に抑えながら情報を表示するための他のブロックを提供します。

アルティメット・ブロックの短所：

• 他のプラグインに比べ、アコーディオンアイコンの設定が限られている。

Ultimate Blocksを選んだ理由： WordPressユーザーのほとんどは、すでにブロックエディターにかなり慣れているので、UltimateBlocksはエディターですぐにアコーディオンを追加するのに適している。コンテンツ・トグル・ブロックは無料プラグイン版でも利用できる。

6.イージー・アコーディオン

WooCommerce商品ページ用のアコーディオン・プラグインを探しているなら、Easy Accordionをチェックすることをお勧めします。私たちは、商品ページに詳細なFAQセクションを作成するためのサポートを含むProバージョンを特に気に入っています。

複数の商品カテゴリーに同じFAQを用意する場合、このプラグインで簡単に実装できます。その結果、ページごとに異なるFAQを作成する必要がなくなります。

Easy Accordionは翻訳にも対応しており、WPMLやPolyLangのような多言語プラグインと互換性があります。あなたが多言語ビジネスを運営しているなら、これは素晴らしいことです。

もう一つの素晴らしい機能はカスタムショートコードジェネレータです。これによって、後で埋め込む必要があるときのために、アコーディオン・ショートコードを簡単に差別化することができます。

イージー・アコーディオン・プロの長所：

• Gutenbergとほとんどの主要なWordPressページビルダープラグインをサポートしています。
• 既存のページ、投稿日、カスタム投稿タイプ、さらにはタクソノミーからアコーディオンを作成し、アコーディオンコンテンツを挿入する時間を節約することができます。
• 垂直タブやマルチカラムセクションから水平トグルまで、複数のアコーディオンレイアウト。
• スキーママークアップやnofollowリンクなどのSEO機能を含む。

イージー・アコーディオン・プロの短所：

• プラグインには無料版が付属しているが、素晴らしい機能のほとんどはプロ版にロックされている。

Easy Accordionを選んだ理由 : WooCommerce商品ページと翻訳プラグインのビルトインサポートにより、Easy Accordionはオンラインビジネスに最適です。

7.アコーディオンFAQ

ドラッグアンドドロップビルダーを備えた、飾り気のないアコーディオンプラグインをお探しなら、Accordion FAQをおいて他にありません。このプラグインを使えば、折りたたみ可能な複数のコンテンツセクションを簡単に作成し、バックエンドから好きなように移動させることができます。

無料のAccordion FAQプラグインにはテンプレートが1つしかありませんが、非常にユーザーフレンドリーで多機能であることがわかりました。より多くのデザインを選択するには、Proバージョンにアップグレードして18以上のテンプレートを入手できます。

プラグインはまた、アコーディオンをカスタマイズする多くの方法を提供します。30種類以上のアニメーションスタイル、数十種類のFont Awesomeアイコン、500種類以上のGoogleフォントを自由に使って、アコーディオンをよりユニークなものにしましょう。

アコーディオンの長所 FAQ：

• ユーザーフレンドリーなドラッグ＆ドロップ式アコーディオンエディター。
• 無制限のカラーオプション、豊富なアニメーションスタイル、アイコン、Googleフォントなど、多くのカスタマイザー設定。
• プロプランの価格は6ヶ月で9ドルからと、かなりお手頃だ。
• Bootstrapフレームワークをベースにしており、アコーディオンのレスポンシブ・デザインを実現しています。

アコーディオンFAQの短所：

• 無料プラグイン版では複数の広告が表示されるため、ユーザー体験が悪くなる可能性がある。

Accordion FAQを選んだ理由 もしあなたがドラッグ＆ドロップ機能付きのシンプルなアコーディオン・プラグインを探しているなら、プラグインページの広告を気にしない限り、Accordion FAQは素晴らしい設定だ。

ボーナス：究極のショートコード

Shortcodes Ultimateは、アコーディオンを含む様々なコンテンツ要素を追加するためのショートコードのセットが付属しているWordPressプラグインです。詳しくは、Shortcodes Ultimateのレビューをご覧ください。

ショートコードを使用しているので、ページや投稿からウィジェット対応エリアまで、WordPressサイトのどの部分にもアコーディオンショートコードを追加できます。また、ほとんどの最新テーマでスムーズに機能するため、テーマの互換性を心配する必要もない。

このプラグインで気に入らないのは、アコーディオン用のショートコードとHTMLがかなり長く、コンテンツをインサートするときに注意しなければならないことだ。それが、このオプションを上記と同じリストに入れなかった理由です。

最高のWordPressアコーディオン・プラグインとは？

最適なWordPressアコーディオン・プラグインは、あなたのニーズによって異なります。

FAQコンテンツ用のアコーディオンプラグインを探しているなら、Heroic FAQsをお勧めします。ドラッグアンドドロップエディターは使いやすく、アコーディオンを作成するための様々なカスタマイザー機能を備えています。

アコーディオンブロックを備えたページビルダーを探しているなら、SeedProdが最適な設定です。SeedProdは、アコーディオンの見た目や動作に関する様々なコントロールや設定を提供します。さらに、アコーディオンのデザインはページ上の他のエレメントとの相性も抜群です。

最後に、無料のWordPressアコーディオン・プラグインを探している人は、Accordionsを検討してみよう。このプラグインには、シンプルなアコーディオンや縦型タブコンテンツを作成するのに必要なものがすべて含まれています。また、遅延ローディングにより、アコーディオンがサイトを遅くすることもありません。

WordPressのアコーディオンに関するFAQ

WordPressでアコーディオンを追加する際によくある質問について説明します。

WordPressにアコーディオンを追加するには？

WordPressでアコーディオンを追加する最も簡単な方法は、Heroic FAQsや SeedProd、Accordionsなどのプラグインを使うことです。これらのツールを使えば、すぐに使えるアコーディオンをページや投稿に挿入し、自分好みにカスタマイズすることができます。

どのWordPressアコーディオン・プラグインが最高のカスタマイザー設定を提供するか？

Heroic FAQsは、アコーディオンを作成するための最高のカスタマイズオプションを提供します。ドラッグ＆ドロップエディター、定義済みアコーディオンスタイル、15種類のFAQアイコン、CSS3アニメーション、トグルスタイルオプションなどが付属しています。

SeedProdは、アコーディオンの外観や動作を変更するための包括的なカスタマイズオプションも提供しています。色やタイポグラフィを変更するだけでなく、特にモバイル端末用にアコーディオンのサイズを調整することができます。

FAQセクションの作成に最適なWordPressアコーディオンプラグインは？

Heroic FAQsは、FAQセクションを作成するための優れたWordPressアコーディオンプラグインです。このプラグインを使用すると、さまざまなスタイルを使用してアコーディオンを作成し、情報を理解しやすくするためにさまざまなリッチコンテンツを挿入することができます。

WordPressサイト改善のための究極のガイド

• WordPressでビジュアライザーを使って棒グラフを作成する方法
• WordPress用ベストGoogleマッププラグイン（ほとんどが無料）
• WordPressサイトにWebプッシュ通知を追加する方法
• WordPressのベストクイズプラグイン
• WordPressでフィットネストラッカーを作成する方法（チャート付き）
• WordPressで音声音楽プレーヤーウィジェットを追加する方法
• WordPressのサイドバーにランダムな名言を表示する方法

この投稿が、最高のWordPressアコーディオンプラグインを見つける手助けになったなら幸いです。また、あなたが見逃している最も楽しいWordPressプラグインのピックアップや、WordPressで自動ワークフローを作成する方法についてのガイドもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.