「アコーディオン」ショートコード表示サンプル

ショートコードで簡単にアコーディオン(開閉式のコンテンツ)を表示可能です。

ブロックでも利用可能です

このページで紹介しているアコーディオンショートコードは、ブロックエディタでも利用可能です。

実際の表示例

「アコーディオンタイトル」という箇所をクリック(もしくはタップ)すればその下の隠れていたコンテンツが表示されます。

表示にはCSSを使っているのでとっても軽量です。

ここにコンテンツを記載

ここにコンテンツを記載

アコーディオンショートコードの中で関連記事ショートコードを呼び出してみるテスト

書き方

[open title="ここにタイトル"]...[/open]というショートコードで呼び出すことができます。

[open title="アコーディオンタイトル01"]
 ここにコンテンツを記載
 [/open]

使い所

このショートコードの使い所は、補足説明に使う場合に効果的です。普段見えていない分、コンパクトなので記事内の補足説明がスッキリ。

ただし、コンテンツ部分は普段隠れているので、重要なコンテンツには使用するべきではないでしょう

全員が見る必要はないけど、補足としてあったほうが良い
そのような補足コンテンツには最適です。

CTAを設置しよう!

ここにリンクさせたい自分の商品やアフィリエイトリンクなどを表示させることが可能です。記事下のCTAは収益化においてかなり重要となるので効果的に使いたいところです。タグを追加してあげれば画像なども表示させることが可能!簡単にサイトの収益化の仕組みを導入することができます。

ABOUT US
OPENCAGEサブテキストがはいります!
ライターのプロフィールが入ります。このライター情報を入れたくない場合は管理画面の ユーザー > あなたのプロフィールの「プロフィール情報」を未入力にすれば表示されません。逆に「プロフィール情報」を入力することでライター情報を表示できます。