Easy Accordion:アコーディオン型よくある質問ページを作成できる

2019年7月18日

アコーディオン型よくある質問(FAQ)が作成できる WordPress 用プラグインの紹介です。
それは「Easy Accordion」です。
そのインストール手順から日本語化・使い方と設定などを解説していきます。

Easy Accordion

Easy Accordion - WordPress.org

Easy Accordion は、複数のアコーディオン型よくある質問(FAQ)が作成できます。

記事を作成もしくは更新時点でのバージョン:v 2.0.3
マルチサイトでの利用:可

Gutenberg エディターでの動作

Gutenberg エディターに追加される機能は無いので、気にする必要は無いです。

Gutenbergでのショートコードの挿入手順

このプラグインは、ショートコードを使用します。
挿入手順については、下記の記事にて詳しく解説していますので、御覧ください。
Gutenberg でのショートコードの挿入手順 – WordPress活用術

インストール手順

下記の URL から ZIP ファイルを入手して、管理画面からアップロードして有効化するか
Easy Accordion – WordPress.org

もしくは、WordPress.org の公式プラグインディレクトリにリリースされているので、
管理画面から入手できます。

ダッシュボードから「プラグイン」メニューの「新規追加」を選択し、
プラグイン追加画面右上の検索窓に「Easy Accordion」と入力します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

検索結果の一番左上に表示されると思うので、「今すぐインストール」をクリックします。
※一番左上に表示されない場合は、上記の画像から探して下さい。
インストールが完了したら、プラグインを「有効化」します。

プラグインのインストールに慣れていない方は、
下記の記事にて詳しく解説していますので、御覧ください。

WordPressプラグインのインストール手順を解説 – WordPress活用術

日本語化

Easy Accordion を有効化した際に日本語化されない場合には、
日本語化用の言語パックを translate.wordpress.org から入手できる場合があります。

WordPress と関連プロジェクト(テーマ・プラグイン)用の翻訳プラットフォームとして、
translate.wordpress.org (GlotPress) が導入されています。

※ボランティアで翻訳されている場合が多いので、
全てのプラグインで、必ずしも日本語化用の言語パックが用意されているわけでは無いです。
また、用意されていても 100% 翻訳されている保証もありません。

日本語化用の翻訳ファイルの探し方は、下記の記事を参照してください。

WordPress公式での日本語化用の翻訳ファイルの探し方 – WordPress活用術

専用メニュー

WordPressプラグイン「Easy Accordion」のスクリーンショット

ダッシュボードの「設定」メニューの下に追加されています。

管理画面

WordPressプラグイン「Easy Accordion」のスクリーンショット

使い方

WordPressプラグイン「Easy Accordion」のスクリーンショット

管理画面で識別できるタイトルを入力します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

Accordion Type
アコーディオンのタイプを選択します。
※Free 版では不可。

Add New Item
FAQ の入力エリアを作成できます。

WordPressプラグイン「Easy Accordion」のスクリーンショット

FAQ の入力エリアです。

WordPressプラグイン「Easy Accordion」のスクリーンショット

編集画面下部で表示される各 FAQ セクション用のショートコード。

アコーディオン設定

WordPressプラグイン「Easy Accordion」のスクリーンショット

Accordion Layout
Choose a Theme
Pro 版のみ選択可能です。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Activator Event
    アコーディオンを広げる際のアクションを選択します。
  • Accordion Mode
    FAQ の初期表示時の状態を選択します。
  • Multiple Opening Together
    同時に複数のアコーディオンを開くかどうか。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Fixed Content Height
    FAQ セクションの表示領域を制限するかどうか。チェックを付けると高さを設定できます。
  • Preloader
    ページの読み込みが完了するまで非表示にするかどうか。

表示設定

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Accordion Section Title
    アコーディオンのセクションタイトルを表示するかどうか。チェックを付けるとマージンを入力できます。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Expand & Collapse Icons
    開閉アイコンを表示するかどうか。
  • Expand & Collapse Icon Style
    開閉アイコンを選択します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Expand & Collapse Icon Size
    開閉アイコンのサイズを px 単位で入力します。
    初期値:16 px
  • Icon Color
    開閉アイコンのカラーを選択します。
  • Expand & Collapse Icon Position
    開閉アイコンの表示位置を選択します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Item Border
    各項目の枠線の幅・スタイル・色を指定します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Title Color
    タイトルの文字色を選択します。
  • Title Background Color
    タイトル部の背景色を選択します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Description Color
    説明部の文字色を選択します。
  • Description Background Color
    説明部の背景色を選択します。

WordPressプラグイン「Easy Accordion」のスクリーンショット

  • Transition Time
    アコーディオンが開ききる、もしくは閉じきるまでの時間をミリ秒単位で入力します。
    初期値:500 ミリ秒

タイポグラフィ

WordPressプラグイン「Easy Accordion」のスクリーンショット

WordPressプラグイン「Easy Accordion」のスクリーンショット

Pro 版のみの機能です。

設定(Settings)

高度な設定(Advanced Settings)

WordPressプラグイン「Easy Accordion」のスクリーンショット

Remove Data when Uninstall
Easy Accordion を削除時に Easy Accordion が使用している全てのデータを削除するかどうか。

Font Awesome CSS
Font Awesome の CSS を使用するかどうか。

カスタムCSS(Custom CSS)

WordPressプラグイン「Easy Accordion」のスクリーンショット

カスタム CSS コードを入力できます。

表示例

WordPressプラグイン「Easy Accordion」のスクリーンショット

実際に表示させると上のような感じで表示されます。

代替プラグイン

Easy Accordion にほしい機能が無かった場合には、
Easy Accordion 以外にもよくある質問ページを作成できるプラグインを記事にしています。
以下では、Easy Accordion を含めて 7 個を簡単に紹介しています。

よくある質問ページを作成できるWordPressプラグイン一覧

URL

Easy Accordion – WordPress.org

本ページはアフィリエイトプログラムによる収益を得ています