アコーディオンショートコードは、クリックで開閉するコンテンツを簡単に作成できる、【Hima Art Utility】プラグインの機能の1つです。

ショートコードの間に挿入したブロック(複数可)を開閉表示させることができます。

このショートコードを使うことで以下のような表示をさせることができます。

クリックすると開閉します

アコーディオン内の段落ブロックです

Hima Art Utility

ショートコードの使い方

以下のショートコードを挿入し、ショートコード間に開閉表示させたいブロックを含めることで機能します。

ショートコードは、ブロックの追加→「すべて表示」→「パターン」→「HAUコンテンツ追加ショートコード」から呼び出すこともできます

[ha-accordion title="" class="" header=""]
開閉させるブロック
[/ha-accordion]

ショートコード内のパラメーター値を指定することで、カスタマイズできるようにしています。

パラメーター説明デフォルト
title開閉ボタンのタイトルを指定しますなし
classプリセットカラーの指定ができます(下のサンプル参照)
※独自のCSSクラスを設定することも可能です
なし
headerタイトル部分のHTMLタグspan

プリセットカラーのサンプル

なし(白)

プリセットカラー(指定なし)

プリセットカラー指定なしの場合の表示内容

red

プリセットカラー red(赤)

プリセットカラーred(赤)の場合の表示内容

blue

プリセットカラー blue(青)

プリセットカラーblue(青)の場合の表示内容

green

プリセットカラー green(緑)

プリセットカラーgreen(緑)の場合の表示内容

yellow

プリセットカラー yellow(黄色)

プリセットカラーyellow(黄色)の場合の表示内容

dark

プリセットカラー dark(暗色)

プリセットカラーdark(暗色)の場合の表示内容

本機能使用に関する注意事項など

1つの投稿や固定ページ本文内へ複数のアコーディオンショートコードを使用しても動作しますが、一定数以上(環境による)挿入するとページ表示が重くなったり、編集画面が重くなることがあります。