プラグイン「Emanon Blocks」を有効化すると、「アコーディオンブロック」が利用できます。アコーディオンブロックは、見出と文章(またはブロック)を設定できます。見出にはアイコンの表示が可能です。

設定方法

アコーディオンブロックは、Webページのコンテンツ部分を開閉することで表示・非表示を設定できるブロックです。ページが冗長な時に見やすくしたい、あるいは情報の取得を閲覧者の任意にしたいなどの用途で使用します。

編集画面上の+アイコンをクリックしてアコーディオンブロックを配置します。デフォルトの状態では下記画像のようにアコーディオンは開いた状態で編集画面に表示されます。

見出しを入力の部分には見出しテキストを入力できます、設定したい内容に適したテキストを入力しましょう。

スタイル

ブロックの見た目を指定する機能です。スタイルサイズで線の太さを調整できます。

デフォルト

ブロックを配置した初期状態のスタイルです。

区切り[線]
区切り[波線]
区切り[点線]
見出し[線]
見出し[上下]

開閉設定

閉じた状態または開いた状態の表示指定や開閉アイコンの設定を行います。

  1. 初期表示の状態を設定します。
  2. 開閉アイコンの配置を左配置または右配置から指定します。
  3. 開閉アイコンを4種類から1つ指定します。

ボーダー設定

アコーディンブロックの外枠を線で表現する設定です。

  1. ボーダーの種類を選択します。
  2. 有効にするとアコーディオンブロックに影が付与されます。
  3. アコーディオンブロックの角の丸みを調整でます。
  4. ボーダーとアコーディオンの間に隙間を発生させます。

見出し設定

見出しの高さやフォントの太ささ、角の丸みなどを調整できます。

  1. 見出し背景色の角丸を指定します。
  2. 見出しの角丸を反映する箇所をしています。

アイコン設定

見出しの前にアイコンを表示する設定です。アイコンリストから希望するアイコンを指定できます。

コンテンツ設定

アコーディオンのコンテンツ内に関する設定項目です。余白(パディング)のサイズブロック間の余白(距離)を一括指定できます。ブロック間の余白を個別に指定する場合、スペーサー[Emanon]を使用してください。

  1. コンテンツ内の余白を上下左右に調整できます。
  2. コンテンツに配置したブロック同士の距離を一括で調整する機能です。

表示例

下記ブロックは、開閉設定を開くに指定した例です。

表示例

開閉設定を開くに指定しています。

段落ブロック以外のブロックも配置可能です。下記は画像ブロックを配置した表示例です。

Emanon Pro

下記ブロックは、開閉設定を閉じるに指定した例です。

表示例

下記ブロックは、開閉設定を閉じる・開閉アイコンを左に指定した例です。

表示例