SWELLのFAQブロックを開閉式(アコーディオン)にしてみたカスタマイズです。
2つのコードをコピペするだけでOK!子テーマやfunctions.phpをいじらず、WordPressの管理画面内でカスタマイズが完結するようになっています。
滑らかに表示されるように、表示アニメーションにもこだわってみました。
完成するとこんな感じ
- これはサンプルの質問です
-
回答を開閉式で表示することができます
- 文章が長い場合も表示崩れはありません。これはサンプルのテキストです。これはサンプルのテキストです。
-
文章が長い場合も表示崩れはありません。これはサンプルのテキストです。これはサンプルのテキストです。
FAQブロックは4つのスタイルから好きなデザインを選べる仕様になっていますが、どのスタイルを選択してもきれいに表示されます。
- これはサンプルの質問です
-
回答を開閉式で表示することができます
- 文章が長い場合も表示崩れはありません。これはサンプルのテキストです。これはサンプルのテキストです。
-
文章が長い場合も表示崩れはありません。これはサンプルのテキストです。これはサンプルのテキストです。
CONTENTS
▾アイコンについて
アイコンの色はサイトのメインカラーになります。
カスタマイズを紹介した後で▾の色を変える方法や、別のアイコンにする方法も記載します。
バリエーション
- これはサンプルの質問です
-
回答を開閉式で表示することができます
- 文章が長い場合も表示崩れはありません。これはサンプルのテキストです。これはサンプルのテキストです。
-
文章が長い場合も表示崩れはありません。これはサンプルのテキストです。これはサンプルのテキストです。
カスタマイズの諸注意
カスタマイズする際の注意事項
- 作業前にバックアップを取ることを推奨します。
- カスタマイズは自己責任でお願いします。
変更履歴等
- SWELL 2.13.0 動作確認済み(2024/12/13)