AFFINGER6：FAQブロックの使い方と出来ること

AFFINGER6のFAQブロック機能は「AFFINGER ver20230703」で追加された機能です。

他のテーマを利用していてずっと感じていたことですが、AFFINGER6では見出しとしてのFAQ機能はあったのですが、使い勝手があまり良くないと感じていました。

もっと自由度の高いFAQ機能が欲しいと思っていましたが、ついに「AFFINGER ver20230703」でFAQブロックが追加されました！

この記事では追加されたFAQブロックの使い方や出来ることを初心者向けに解説しています。

ブロックツールにFAQブロックが追加されているので、それを選択することで簡単に作成できます。

AFFINGER6：FAQブロックで出来ること

①　スタイル	FAQのスタイルを４種類から選択可能
②　色	FAQブロック全体の背景色とテキスト色を設定可能
③　質問	質問アイコンの色とサイズを変更可能
④　回答	回答アイコンの色とサイズを変更可能
⑤　HTML	質問のHTMLタグ設定

①　スタイル

FAQブロックのスタイルを４種類から選ぶことができます。

• デフォルト
• スクエア
• 角丸
• 丸

デフォルト

　デフォルトはどんな感じですか？

　デフォルトはこんな感じです。

スクエア

　スクエアはどんな感じですか？

　スクエアはこんな感じです。

角丸

　角丸はどんな感じですか？

　角丸はこんな感じです。

丸

　丸はどんな感じですか？

　丸はこんな感じです。

②　色

FAQブロック全体の背景色やテキスト色を変更することができます。

FAQブロックの背景色を変更するとこんな感じです。

FAQブロックの背景色を変更するとどんな感じ？

FAQブロックの背景色を変更するとこんな感じです。

FAQブロックのテキスト色を変更するとこんな感じです。

FAQブロックのテキスト色を変更するとどんな感じ？

FAQブロックのテキスト色を変更するとこんな感じです。

③　質問

質問アイコンのサイズと色を変更することができます。

質問アイコンの色を変更するとこんな感じです。

質問のアイコン色を変更することはできるの？

こんな感じで質問アイコンの色を変更可能です。

質問アイコンのサイズを変更するとこんな感じです。

質問のアイコンのサイズを変更することはできるの？

こんな感じで質問アイコンのサイズを変更可能です。

※　スマホ表示ではサイズ変更は反映されない可能性があります。

④　回答

回答部分のアイコン色とサイズを変更することができます。

回答アイコンの色を変更するとこんな感じです。

回答のアイコン色を変更することはできるの？

こんな感じで回答アイコンの色を変更可能です。

回答アイコンのサイズを変更するとこんな感じです。

回答のアイコンのサイズを変更することはできるの？

こんな感じで回答アイコンのサイズを変更可能です。

※　スマホ表示ではサイズ変更は反映されない可能性があります。

⑤　HTML

質問のHTMLタグ設定が可能です。

このHTMLタグ設定では質問部分の見出し（ｈ１～ｈ６）タグを設定することができます。

見出しのタグは目次にも反映されるので、自由に設定できるのはありがたいです。

見出しについての詳細は別記事を参考にしてみてください。

見出しについての詳細はこちら

AFFINGER6の使い方

AFFINGER6の使い方については、このブログで詳しく解説しています。

AFFINGER6：関連記事