SWELL FAQブロックの使い方|よくある質問(Q&A)の作成方法と設定を解説

SWELL FAQブロックの使い方と設定方法を解説

こんにちは "osaboo"osabooです。"@osaboo_Bot"

SWELLのFAQブロックを使えば、記事内によくある質問(Q&A)を見やすく表示できます。

Question

SWELLのFAQブロックってどうやって使うの?
構造化データの設定は必要?
FAQブロックのデザインは変更できる?

SWELLには、よくある質問(FAQ)を簡単に作成できる専用ブロックが用意されています。

FAQブロックを使えば、読者の疑問に先回りして回答できるだけでなく、記事の読みやすさ向上にも役立ちます。

また、構造化データの出力設定にも対応しており、SEOを意識した記事作成にも活用できます。

この記事では、SWELLのFAQブロックの使い方から設定項目、デザイン変更方法まで初心者向けにわかりやすく解説します。

こんな人におすすめ
  • SWELLでFAQブロックを使いたい
  • よくある質問(Q&A)を見やすく表示したい
  • FAQブロックの設定項目や使い方を知りたい
  • FAQの構造化データについて理解したい
  • 記事の読みやすさや利便性を向上させたい
この記事でわかること
  • SWELL FAQブロックの使い方
  • FAQブロックの挿入方法と質問・回答の作成手順
  • 各設定項目の役割とおすすめ設定
  • FAQ構造化データの設定方法
  • FAQブロックを活用するメリットと注意点
  • FAQブロックと他のSWELLブロックとの違い

それではご覧ください。

迷ったら“使いやすさ”で選ぶのが正解です。

目次 "Contents"

SWELL FAQブロックとは

SWELL FAQブロックは、よくある質問と回答(FAQ)を見やすく表示できる専用ブロックです。

質問と回答をセットで作成できるため、読者が知りたい情報を素早く確認できます。

また、FAQ用の構造化データ(FAQPage)の出力にも対応しており、検索エンジンにFAQコンテンツとして認識されやすくなる点も特徴です。

記事の最後によくある質問をまとめたり、サービスや商品の疑問点を補足したりする際に活用できます。

FAQの表示例(当サイト向けにアレンジしています)

テキストを入力…

ブロックを選択するには「/」を入力

テキストを入力…

ブロックを選択するには「/」を入力

FAQブロックでできること

  • よくある質問と回答を見やすく表示できる
  • 質問と回答を複数まとめて管理できる
  • デザインを変更できる
  • FAQ構造化データを出力できる
  • 読者の疑問を先回りして解消できる

SWELL FAQブロックの使い方

ここでは、FAQブロックを挿入して質問と回答を作成する手順を解説します。

手順は次の通りです。
  • FAQブロックの挿入手順
  • FAQブロックの設定

それでは順番に見ていきましょう。

❶ FAQブロックの挿入手順

  • 投稿(エディター)画面での作業になります。

FAQブロックを挿入する手順をご紹介します。

STEP
投稿(エディター)画面を準備

Menu『WordPress管理>ダッシュボード>投稿>投稿を追加』をクリックします。

投稿(エディター)画面が表示されます。
(編集する場合は、投稿一覧から対象記事を選択してください。)

FAQブロックを挿入する箇所をクリックします。

STEP
ブロック挿入ツールを切り替え

『+(ブロックインサーター)』をクリックします。

WordPressエディター画面でブロック挿入ツールを切り替えている様子
STEP
ブロックタブから『FAQ』を選択

ブロック挿入ツールが『x』切り替わり 以下の画面が表示されます。

SWELLブロックから『FAQ』を選択して投稿(エディター)画面に挿入します。

『FAQ』をクリックします。

SWELLのFAQを挿入するためにブロック一覧から「FAQ」を選択する画面
STEP
FAQブロック挿入完了

投稿(エディター)画面に『FAQ』ブロックが表示されます。

挿入直後では、以下のように表示されます。

  • FAQブロックを挿入すると、「Q(質問)」と「A(回答)」の入力欄が表示されるので、任意の内容を入力できます。
  • 「+」をクリックすると「Q(質問)」と「A(回答)」の入力欄が追加されます。
SWELLでFAQブロックを挿入したエディター画面

❷ FAQブロックの設定

まずは、投稿(エディター)画面右側に表示される「設定 > ブロック」タブの設定項目を確認していきましょう。

各設定は、投稿(エディター)画面右側の「設定 > ブロック」タブから確認できます。

設定パネルが表示されていない場合は、以下の画面を参考に右上の設定アイコンをクリックしてください。

投稿(エディター)画面右側の設定アイコンをクリックしてブロックタブを表示する手順画面
yajirusi-sita-80x40
SWELL FAQブロックのブロック設定パネルを表示している画面

FAQの設定方法(設定

詳細設定項目

SWELL FAQブロックのFAQ設定を表示している画面
FAQ
FAQ設定
  • 構造化データを出力する
    • ON / OFF(ラジオボタン切替)
  • タイトルのHTMLタグ
    • dt・h2・h3・h4・h5・h6(選択 / 切替)
  • Q / Aのアイコンの形
    • 四角・角丸・丸(選択 / 切替)
SWELL FAQブロックのFAQ設定でアイコンの色を設定している画面
  • Qアイコンの色
    • テキスト色
    • メインカラー
    • カスタムカラー
    • テキスト色(塗り潰し)
    • メインカラー(塗り潰し)
    • カスタムカラー(塗り潰し)

6種類から選択 / 切替

  • Aアイコンの色
    • テキスト色
    • メインカラー
    • カスタムカラー
    • テキスト色(塗り潰し)
    • メインカラー(塗り潰し)
    • カスタムカラー(塗り潰し)

6種類から選択 / 切替

SWELL FAQブロックのFAQ設定にあるデバイス制限を設定している画面
デバイス制御
  • 表示するデバイスサイズ
    • SP / PC / クリア(選択 / 切替)
ブロック下の余白量
  • ドロップダウンメニューから選択
高度な設定
補足
FAQ構造化データ出力

FAQ構造化データ出力を有効にすると、FAQブロックの内容が構造化データ(FAQPage)として出力されます。

この設定を有効にすると、検索エンジンがFAQコンテンツとして認識しやすくなります。

ただし、構造化データを設定しても検索結果にFAQが表示されるとは限りません。

Googleの判断によって表示の有無が決まるため、読者の利便性向上を目的として活用するのがおすすめです。

タイトルのHTMLタグ

HTMLタグでは、FAQの質問部分に設定する見出しタグを変更できます。

通常は「div」のままで問題ありません。

ただし、FAQを記事内の見出しとして扱いたい場合は、サイト構造に合わせて適切な見出しタグを選択してください。

見出し階層が崩れるとSEOや可読性に影響するため、むやみに変更しないよう注意しましょう。

FAQの設定方法(スタイル

詳細設定項目

SWELL FAQブロックのスタイル設定項目を表示している画面
FAQ
スタイル
  • シンプル
  • 枠あり
  • ボックス
  • ストライプ

4種類から選択

補足
スタイル

スタイルでは、FAQブロックのデザインを変更できます。

ブロックを選択した状態でツールバーの「スタイル」をクリックし、好みのデザインを選択してください。

スタイル特徴
デフォルトシンプルでどの記事にも合わせやすい
線あり質問と回答の区切りがわかりやすい
ボックス情報を目立たせたい場合に向いている
ストライプカジュアルなデザインの記事と相性が良い
  • 記事の雰囲気に合わせて使い分けましょう。

SWELL FAQブロックのカラー設定(グローバル設定)

ここでは、FAQブロックのグローバル設定についてご紹介します。
FAQブロックの 「Q / A」の2種類を設定することができます。

Menu『WordPress管理>ダッシュボード>SWELL設定>エディター設定>カラーセット(タブ)』をクリックします。

エディター設定での変更は、全てのSWELL FAQブロックに反映されます。

「Q&A設定」が表示されるまで下にスクロールします。

SWELL設定のエディター設定にあるカラーセットタブを表示している画面

以下の画面が表示されたら、「カラー」から「Q:」と「A:」の色を設定します。

SWELL設定のエディター設定にあるQ&A設定を表示している画面

FAQブロックを使うメリット

FAQブロックを活用すると、読者の疑問をわかりやすく整理できるだけでなく、記事全体の利便性向上にもつながります。

ここでは、FAQブロックを使う主なメリットを紹介します。

読者の疑問をまとめて解消できる

FAQブロックを使えば、記事内で補足しきれなかった内容や、読者が抱きやすい疑問をまとめて回答できます。

質問と回答がセットで表示されるため、必要な情報を素早く確認できる点がメリットです。

特に、操作手順や設定方法を解説する記事との相性が良く、読者満足度の向上につながります。

記事の読みやすさが向上する

FAQブロックは質問と回答を視覚的に区別して表示できるため、情報を整理しやすくなります。

長文の記事でも内容を把握しやすくなり、読者が目的の情報を見つけやすくなるでしょう。

また、記事の最後にFAQを設置することで、よくある質問を効率よく補足できます。

FAQ構造化データを出力できる

SWELLのFAQブロックは、FAQ構造化データ(FAQPage)の出力に対応しています。

設定を有効にすると、検索エンジンにFAQコンテンツとして認識されやすくなります。

SEO効果を直接保証するものではありませんが、検索エンジンがページ内容を理解する手助けになるため、活用しておいて損はありません。

FAQブロックを使う際の注意点

FAQブロックは便利な機能ですが、利用する際にはいくつか注意点があります。

FAQを増やしすぎない

FAQが多すぎると、かえって読者が必要な情報を探しにくくなります。

本当に読者が疑問に思う内容だけを厳選して掲載しましょう。

本文と同じ内容を繰り返さない

FAQは補足情報として活用するのがおすすめです。

本文で詳しく説明している内容をそのまま繰り返すと、冗長な記事になってしまいます。

読者が追加で知りたい内容を中心にまとめましょう。

見出し階層に注意する

HTMLタグを見出しタグ(h2〜h6)に変更する場合は、記事全体の見出し構造を意識する必要があります。

見出しの階層が崩れると、読者にも検索エンジンにもわかりにくいページになるため注意してください。

よくある質問

AQブロックと詳細ブロック(アコーディオン)の違いは?

FAQブロックは、質問と回答をセットで表示することに特化したブロックです。

一方、詳細ブロック(アコーディオン)はクリックして内容を開閉できるため、補足情報や注意事項をコンパクトにまとめたい場合に向いています。

よくある質問を掲載する場合はFAQブロック、情報を折りたたんで表示したい場合は詳細ブロックを利用するとよいでしょう。

FAQブロックはSEOに効果がありますか?

FAQブロック自体が検索順位を直接向上させるわけではありません。

ただし、FAQ構造化データを出力することで検索エンジンがページ内容を理解しやすくなる可能性があります。

また、読者の疑問を解消しやすくなるため、ユーザー体験の向上にもつながります。

FAQブロックは複数設置できますか?

はい、1つの記事内に複数のFAQブロックを設置できます。

ただし、FAQが多すぎると読みにくくなるため、本当に必要な内容だけを掲載するのがおすすめです。

FAQブロックのデザインは変更できますか?

はい、変更できます。

SWELLではスタイル設定からデザインを切り替えられるため、サイトのデザインや記事の雰囲気に合わせて調整できます。

まとめ!SWELL FAQブロックの使い方|よくある質問(Q&A)の作成方法と設定を解説

SWELLのFAQブロックを使えば、よくある質問と回答を見やすく整理できます。

質問と回答を簡単に作成できるだけでなく、スタイル変更やFAQ構造化データの出力にも対応しているため、読者にとってわかりやすい記事を作成しやすいのが特徴です。

本記事で紹介した手順を参考に、FAQブロックを活用して読者の疑問を解消しやすい記事作りに役立ててください。

関連記事 FAQをコンパクトに表示したい場合は、詳細ブロック(アコーディオン)の活用もおすすめです。

設定方法は以下の記事で詳しく解説しています。

  • URLをコピーしました!
  • URLをコピーしました!
目次 "Contents"