アコーディオンFAQセクション
クリックで開閉するアニメーション付きFAQブロック。CSS heightトランジション使用。
使いどころ
クリックで開閉するアニメーション付きFAQブロック。CSS heightトランジション使用。
- サービス LP の下部
- サポートページ
- 資料請求ページの安心材料
- サブスクサービスの解約条件説明
カスタマイズのポイント
<details> / <summary> ベースなので JS なしで動作。質問数が多い場合は検索バー付き(faq-search-filter)パターンが便利。
このパーツは JavaScript が含まれます。HTML の最後に <script> タグで読み込むか、外部 JS ファイルに切り出してください。
注意点
JSON-LD の FAQPage 構造化データを併用すると、Google 検索結果でリッチリザルト表示される可能性あり(保証はされない)。マークアップとページ内表示は一致させること。
よくある質問
このパーツは商用利用できますか?
はい。moatway がオリジナル制作したパーツは商用・個人問わず自由にご利用いただけます。
そのまま貼り付ければ動きますか?
はい。HTML / CSS タブをそれぞれコピーすればすぐ動作します。クラス名が既存サイトと衝突する場合はリネームしてください。
JavaScript が必要なパーツはありますか?
一部のパーツ(アコーディオン・タブ切替・告知バーの閉じる機能など)は JavaScript が必要です。詳細ページの JS タブで確認できます。
ブラウザ対応は?
最新 2 世代の Chrome / Safari / Firefox / Edge で動作確認しています。