アコーディオンブロックの使い方

このページでは、WordPressテーマ『SWELL』で利用可能なGutenberg用ブロック、「アコーディオンブロック」の使い方を解説していきます。

このブロックを使うと、クリック（タップ）でコンテンツが開閉できる、いわゆる「アコーディオンメニュー」を簡単に設置することができます。

動画で使い方を確認！

SWELLのアコーディオンブロックの使い方

ブロック追加ボタンから「SWELLブロック」タブの中にある「アコーディオン」と書かれたブロックを選択すると使用できます。

もしくは、/accordionというブロックキーワードからも簡単にブロックを選択できます。

アコーディオンブロックを追加すると、以下のような初期状態でブロックが挿入されます。

• アコーディオンメニューのタイトル
• アコーディオンメニューのコンテンツ

がセットになったブロックが挿入されており、その下に表示されている「+」マークのボタンを押すと、さらに同じようにアコーディオンメニューの項目を追加できます。

アコーディオンブロックの設定について

アコーディオンブロック（項目ブロックではなく、親ブロックの方）が選択状態の時、エディターに右側にアコーディオンブロック設定用パネルが出てきます。

このパネルから、アコーディオンメニューのスタイルと開閉時のアイコンを設定できます。

アコーディオンブロック使用例

実際に、各種スタイルとアイコンの設定を変えてアコーディオンブロックを設置してみます。