当ブログ愛用のWordPressテーマ
広告
＼乗り換え先おすすめテーマ！／
／ブロガーとして本格的に取り組む＼
SWELLの評判レビュー記事
SWELLの評判を徹底レビュー｜Cocoonから乗り換えた理由や使ってみた感想も紹介「SWELLを購入しようか迷っている…」 「SWELLのメリット・エメリットは？」 「SWELLを導入すれば何が変わるのか知りたい」 この記事では、そんな方に向けて、SWELLの評...
SWELLのFAQブロックの使い方｜よくある質問(Q&A)を設置してユーザーの疑問に先回りして答えよう！
「記事によくある質問(Q&A)を設置したい」
「FAQブロックの設定方法は？」
「FAQブロックの構造化データって何？」
この記事では、そんな方に向けて、SWELLでFAQブロックの使い方を解説します。
かめコンパスこんにちは、かめコンパスです！
本記事の内容
＼読みたい箇所をクリック／
この記事を読めば、あなたも簡単に
- よくある質問をQ&A形式で設置できる
- FAQブロックの使い方が分かる
- FAQの構造化データとは何か分かる
ようになります。
私もあなたと同じことに悩んでたのですが、本記事の方法でサクッと解決でき、
目次や検索結果ページによくある質問を表示させることでユーザビリティーやSEO評価の向上に役立てています。
どこよりも分かりやすく書いている自信がありますので、あなたもパパッと解決してみてください！
＼SWELL購入を検討中の人はこちらもご覧ください！／
あわせて読みたい
SWELLの評判を徹底レビュー｜Cocoonから乗り換えた理由や使ってみた感想も紹介
「SWELLを購入しようか迷っている…」 「SWELLのメリット・エメリットは？」 「SWELLを導入すれば何が変わるのか知りたい」 この記事では、そんな方に向けて、SWELLの評…
目次
SWELLのFAQブロックでできること
SWELLのFAQブロックでは以下のようなことができます。
- よくある質問(Q&A)をおしゃれにデザインできる
- よくある質問(Q&A)を見出し化できる
- よくある質問(Q&A)の構造化データを出力できる
それぞれ詳しく解説します。
よくある質問(Q&A)をおしゃれにデザインできる
SWELLのFAQブロックは「スタイル」「形」「色」を選べ、以下のようなデザインにカスタマイズできます。
- スタイル…「シンプル」「線あり」「ボックス」「ストライプ」の4種類から選べる
- 形…「四角」「角丸」「円形」の3種類から選べる
- 色…「Q」と「A」それぞれで3色から選べ、色を塗り潰すかどうかも選べる
利用できるFAQブロックのデザインは、なんと72通り！(＝4種類のスタイル×3種類の形×6パターンの色)
豊富なカスタマイズ性から、サイトの雰囲気やユーザーに与えたい印象を考慮して選べます。
かめコンパスデザインによって与える印象がガラリと変わるよ
よくある質問(Q&A)を見出し化できる
SWELLのFAQブロックでは、よくある質問の「Q」の部分をhタグ(見出し)にすることができます。
見出し化することで、目次に質問内容を表示させることができますよ。
目次に表示された「Q」の質問内容をクリックすれば、Q&Aのところへすぐジャンプできるのでユーザーの利便性も上がります。
また、検索エンジンに記事内容を分かりやすく伝えられ、SEO効果も期待できますよ。
かめコンパス目次によくある質問を表示できるのはありがたい！
よくある質問(Q&A)の構造化データを出力できる
SWELLのFAQブロックで構造化データを出力することにより、検索結果ページによくある質問の「Q」の部分をリッチリザルトとして表示させることができます。
※画像準備中
これにより、記事のタイトルからだけではなく、よくある質問からもクリックが見込め、トータルのクリック数の向上が期待できますよ。
かめコンパス記事を読んでもらえる数が増える嬉しい機能だね
SWELLのFAQブロックの使い方とカスタム設定
SWELLのFAQブロックの使い方はSWELL公式サイトでもまとめられているが、本記事ではより詳しく紹介します。
公式サイト：【SWELLブロック】Q&Aを簡単に設置！FAQブロックの使い方
STEP
記事編集画面の左上にある+を押して、FAQをクリックする
STEP
これでFAQブロックを呼び出せます。
Qにはテキストのみ入力でき、Aにはテキスト以外のコンテンツブロックも配置できます。
また、FAQブロックの+ボタンをクリックすると、Q&A項目も追加できますよ。
ちなみに、FAQブロックは以下2つの方法からも呼び出せます。
＼タブの切り替え／
FAQブロックを呼び出したい段落ブロックの最初に/faq、もしくは/qaを入力する ※「/」は半角で入力してください。
自分の好きな方法で呼び出しましょう。
かめコンパス個人的に「/faq」で呼び出すのがおすすめ！マウスを操作せずキーボード入力だけで早くかんたんに呼び出せるよ
FAQブロックで設定可能な項目は5つあります。
カスタマイズ項目
※上のリンクをクリックすると見たい場所へジャンプします。
それぞれ詳しく解説します。
設定項目がある場所
- FAQブロックを選択する
- 設定をクリックする
- ブロックをクリックする
スタイルを決める
SWELLではFAQブロックのスタイルを以下の4種類から選べます。
FAQブロックのスタイル「シンプル」「線あり」は、記事内に溶け込むように表示されるのが特徴で、リストブロックの点のスタイルがQとAに置き換わったイメージです。
一方、スタイル「ボックス」「ストライプ」は、どこからどこまでがQ&Aのコンテンツなのか囲われていて分かりやすいですよ。
かめコンパス私のお気に入りスタイルは「ボックス」です
構造化データを出力するか選ぶ
SWELLのFAQブロックでは、構造化データを出力し、検索結果にリッチリザルトを表示させることができます。
FAQの構造化データを出力した場合、検索結果ページに質問内容がアコーディオン形式で表示されるようになりますよ。
※画像準備中
このように、構造化データを出力したほうが検索結果ページに占める記事の表示割合が大きくなり、クリック率の向上が期待できるでしょう。
かめコンパス私もFAQブロックを使うときは必ず構造化データを出力しているよ
タイトル(Q)のHTMLタグを設定する
SWELLのFAQブロックは、タイトル(Qの部分)をhタグ(見出し)にすることができます。
この設定で「Q」を見出し化すれば、目次に質問内容を表示させることができますよ。
目次によくある質問を表示させれば、ユーザーと検索エンジンに内容を分かりやすく伝えることができるので、ユーザーの利便性UP、かつSEO効果も期待できるでしょう。
かめコンパスユーザーとSEOの観点でHTMLタグを設定するに越したことはない！
Q/Aのアイコンの形を選ぶ
SWELLのFAQブロックは、「Q」と「A」のアイコンの形を以下の3つから選ぶことができます。
アイコンの形が「四角」だと真面目で緊張感のある印象を与え、「円形」だと柔らかく穏やかな印象を与えますよ。
かめコンパス個人的には円形が好み！
Q/Aのアイコンの色を設定する
SWELLのFAQブロックでは、「Q」と「A」のアイコンの色もそれぞれで設定できます。
設定できる色は、以下の3種類あります。
- テキスト色（塗り潰しあり or なし）
- メインカラー（塗り潰しあり or なし）
- カスタムカラー（塗り潰しあり or なし）
色からどのような印象を与えたいのか、またはサイトのイメージカラーに合った色を選ぶといいでしょう。
かめコンパスQ&Aの「Q」は赤色、「A」は青色っていう印象が強いね
ちなみに、３種類それぞれのアイコンカラーは自分の好きな色に変更することもできますよ。
＼クリックで開く／
アイコンの色を変更する方法はこちら
※色を変更したい項目のタブをクリックしてください。
STEP
WordPress管理画面で、外観⇒カスタマイズの順にクリックする
STEP
サイト全体設定をクリックする
STEP
基本カラーをクリックする
STEP
- メインカラー（or テキストカラー）の色を選択をクリックする
- カラーピッカー(下図の〇にあたる)を動かして色を選ぶ、もしくはカラーコードを入力して色を指定する
STEP
公開をクリックする
これでアイコンの色を変更できます。
かめコンパスカラーピッカーで好きな色にピンポイントで合わすのは難しいので、カラーコードの入力がおすすめ！
カラーコードが分からない…カラーコードの調べ方が分からない…という人はGoogle Chromeの拡張機能「ColorPick Eyedropper」を使うとかんたんに調べられますよ。
＼クリックで開く／
ColorPick Eyedropperの導入方法とカラーコードの調べ方はこちら
導入方法
- ChromeウェブストアからColorPick Eyedropperを導入するページを開き、chromeに追加をクリックする
使い方
- 使いたい色があるページで、拡張機能⇒ColorPick Eyedropperの順にクリックする
- 使いたい色をクリックすると、#から始まるカラーコードが調べられます
- カラーコードを先ほどの入力欄にコピペすると、使いたい色を利用できます。
SWELLのFAQブロック以外でも構造化データを出力できる！
SWELLではFAQブロック以外でも構造化データを出力できる機能が2つあります。
- 著者情報
- 商品レビューブロック
それぞれ詳しく解説します。
構造化データのおさらい
著者情報の構造化データを出力する
SWELLではサイトの運営者・運営組織の情報を入力することで、構造化データを出力できます。
設定方法は下記のとおり。
STEP
WordPress管理画面で、ユーザー⇒プロフィールの順にクリックする
STEP
「author構造化データ」に著者情報を入力する
STEP
プロフィールを更新をクリックする
これで設定完了です。
author構造化データにある出力項目の説明
- Person…サイト運営者
- Organization…サイト運営組織
- name…著者名
- url…著者のURL
- alternateName…著者の別名
- sameAs…関連URL
- jobTitle…役職名
- honorificPrefix…敬称の接頭辞（例：お～、ご～）
- honorificSuffix…敬称の接尾辞（例：～さん、～様）
- logo…運営組織のロゴ
かめコンパス必要な項目だけ入力してね
商品レビューブロックの構造化データを出力する
SWELLの商品レビューブロックを設定するとき、用途を「レビューボックスと構造化データを両方出力」「構造化データのみ出力」のいずれかを選ぶことで、構造化データを出力できます。
かめコンパス1アクションでかんたんに設定できる！
商品レビューの使い方について、詳しくは下の記事を参考にしてください。
関連記事
SWELL商品レビューブロックの使い方｜スター評価も検索結果に表示できる便利な機能付き！
「投稿ページに商品レビューをおしゃれに書きたい」 「商品レビューブロックの設定や活用方法は？」 「検索結果にスター評価や投稿者名を表示させるには？」 この記事では…
SWELLのFAQブロックでよくある質問
ここからはSWELLのFAQブロックでよくある質問に回答します。
Q&A
かめコンパス気になる質問をクリックしてね
エディター右側にFAQブロックの設定パネルを表示されない原因は？
エディター右側にFAQブロックの設定パネルが表示されない原因は、子ブロックを選択しているからです。
ですので、親ブロックを選択すれば解決します。
詳しくは、本記事「SWELLのFAQブロックの使い方とカスタム設定 – 設定項目がある場所」で紹介しています。
構造化データはSEO(検索順位)に影響しますか？
構造化データはSEO・検索順位に直接的な影響はありません。
また、Google公式サイトでは構造化データに問題があり、手動で対策しても検索順位に影響しないと記載されています。
ページに構造化データの問題がある場合は、手動による対策が実施される可能性があります。構造化データに関する手動による対策が実施されると、ページがリッチリザルトとして表示されなくなります。ただし、Google ウェブ検索でのページの掲載順位には影響しません。手動による対策がとられたかどうかを確認するには、Search Console の手動による対策レポートを開いてください。
引用：構造化データに関する一般的なガイドライン – Google for Developers
ただ、検索結果ページでの表示形式が変わるので、クリック率の上昇は見込めますよ。
構造化データが正しく出力されているか確認する方法はありますか？
FAQブロックの構造化データの出力状況は、リッチリザルトテストで確認できます。
構造化データを出力したページのURLを入力し、URLをテストをクリックするだけです。
数秒待って表示されたページ画面に「よくある質問」の構造化データが検出されていれば問題ないです。
よくある質問が検索結果ページに表示されないのはなぜ？
FAQの構造化データを出力しても、よくある質問が検索結果ページに必ず表示されるとは限りません。
コンテンツポリシーに違反していないか、一般的なガイドラインを遵守しているか等をクリアしている前提で、表示されるかは最終的にGoogleの判断になります。
詳しくは、構造化データに関する一般的なガイドライン – Google検索セントラルをご覧ください。
よくある質問が目次に表示されないのはどうして？
FAQのHTMLタグを設定してもよくある質問が目次に表示されない原因は、見出しを抽出する階層設定がFAQのHTMLタグ設定よりも浅いからです。
例えば、見出しの抽出階層をh2までに設定していたら、それより深いh3でFAQのHTMLタグに設定しても表示されません。
ですので、見出しを抽出する階層設定をFAQのHTMLタグ設定よりも深くすれば目次に表示されますよ。
見出しを抽出する階層の設定方法は、以下のとおりです。
STEP
WordPress管理画面で、外観⇒カスタマイズの順にクリックする
STEP
投稿・固定ページをクリックする
STEP
目次をクリックする
STEP
「どの階層の見出しまで抽出するか」でFAQのHTMLタグ設定よりも数字が大きいhタグを選ぶ
STEP
公開をクリックする
これでよくある質問が目次に表示されます。
SWELLのFAQブロックまとめ
今回は、SWELLでFAQブロックの使い方を紹介しました。
本記事のおさらい
＼読み直したい箇所をクリック／
当ブログでは、SWELLに関する記事をいくつか書いてます。
下のカテゴリーページにまとめていますので、のぞいてみてください。
かめコンパスためになったという人は“(Twitter)フォロー”や“ブックマーク”してくれると嬉しいです！
この記事が気に入ったら
フォローしてね！
コメント