IDEA HACK
コンテンツ
  • ブログ
IDEA HACK
IDEA HACK
コンテンツ
  • ブログ
  1. IDEA HACK
  2. ブログ
  3. WordPress
  4. WordPressでアコーディオンを実装したい時に便利な5のプラグイン

WordPressでアコーディオンを実装したい時に便利な5のプラグイン

2021-01-01 2021-01-02
KAZU

アコーディオンは、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は、アコーディオン特化型のプラグインです。アコーディオンしか使えない代わりにかなり豊富なカスタマイズオプションを持っています。

本ページを検索結果から来た方はアコーディオン目当てだと思いますので、最低限な機能を備えたこちらがおすすめです。

KAZU

もちろん、他のプラグインのアコーディオン以外の機能を使う予定があるのであれば、他のプラグインもありです。

ドラッグアンドドロップビルダーを使用して、バックエンドでアコーディオンの位置を簡単に並べ替えることができます。 また、レスポンシブ対応していて高度にカスタマイズ可能なフロントエンドを提供します。

そして、個人的はBootStrapベースなのが大変嬉しいです。当サイトもBootStrapのGridシステムを使って設計しており、親和性が高いためです。

  • レスポンシブデザイン
  • ショートコードでの表示
  • Bootstrapベース
参照

Accordion FAQ

ダウンロード

多くの場合、これらのいずれかのプラグインでアコーディオンを簡単に導入できると思います。

アコーディオの実装はめんどくさくて、時間のロスになることが多いので、これば無料で切るのはWordPressコミュニティーの凄いところですね。

WordPress
投稿者
KAZU
「Webデザインとプログラミングを独学 → 独自プロダクトとサブスクリプションサービスの構築 → 学習内容をコースとして提供」を繰り返しながら企業でも働く兼業ディベロッパーです。

関連記事

WordPressにソーシャルボタンを追加する際に便利な4つのプラグイン
2021-01-08 WordPress
WordPressのログインURLを変更してログインのフローをハッカーが予測できないようにカスタマイズする方法
2021-01-06 WordPress
WordPressにGoogleのreCAPTCHA認証プラグインを導入し、不正ログイン対応を強化する方法
2021-01-05 WordPress
WordPressへの不正ログイン対策に役立ち、セキュリティ強化にもつながる4つの2段階認証プラグイン
2021-01-03 WordPress
WordPressでアコーディオンを実装したい時に便利な5のプラグイン
2021-01-02 WordPress
WordPress 5.5で遅延読み込みが導入されたからプラグインはもういらない?今のところ一部のプラグインの方が優秀です・・・今はね!!
2020-12-31 WordPress

関連記事

WordPressにソーシャルボタンを追加する際に便利な4つのプラグイン
2021-01-08 WordPress
WordPressのログインURLを変更してログインのフローをハッカーが予測できないようにカスタマイズする方法
2021-01-06 WordPress
WordPressにGoogleのreCAPTCHA認証プラグインを導入し、不正ログイン対応を強化する方法
2021-01-05 WordPress
WordPressへの不正ログイン対策に役立ち、セキュリティ強化にもつながる4つの2段階認証プラグイン
2021-01-03 WordPress
WordPressでアコーディオンを実装したい時に便利な5のプラグイン
2021-01-02 WordPress
WordPress 5.5で遅延読み込みが導入されたからプラグインはもういらない?今のところ一部のプラグインの方が優秀です・・・今はね!!
2020-12-31 WordPress

最新記事

Twitterのハッシュタグをつける時によく検索される人気なものを探してつける方法
Twitter
2021-01-09
WordPressにソーシャルボタンを追加する際に便利な4つのプラグイン
WordPress
2021-01-08
Twitterのベストな投稿時間とは?
ソーシャルメディア
2021-01-07
WordPressのログインURLを変更してログインのフローをハッカーが予測できないようにカスタマイズする方法
WordPress
2021-01-06
WordPressにGoogleのreCAPTCHA認証プラグインを導入し、不正ログイン対応を強化する方法
WordPress
2021-01-05

法務・ルール

  • 利用規約
  • プライバシーポリシー
  • 特定商法取引法に基づく表記

お問い合わせ

  • お問い合わせ

サービス

  • IDEA HACK
  • IDEA FACTORY

Copyright © All rights reserved by Brandia