Q&Aブロック

Q&Aブロック

「よくある質問」の作成に便利なQ&Aブロックです。

  • このページで紹介している機能では有料プラグイン「yStandard Toolbox」を使用しています。
    プラグインの詳細は yStandard Toolbox ページをご覧ください。

Q&Aブロックの追加方法

Q&Aブロックの追加方法

Q&Aブロックは「[ys]yStandard Toolbox」カテゴリーにある「Q&A」を選択します。

Q&Aブロックを追加すると、質問・回答用の入力欄が用意される

Q&AブロックはQA項目をグループ化するブロックの中に質問(Q)ブロックと回答(A)ブロックが追加された状態で追加されます。

設定は「QA項目をグループ化するブロック」と「質問(Q)ブロック」「回答(A)ブロック」でそれぞれ異なります。

Q&Aの設定

質問(Q)ブロック・回答(A)ブロック 設定

「質問(Q)ブロック」「回答(A)ブロック」の設定項目はほぼ同じですですが、それぞれ別々の設定ができるようになっています。

質問・回答内容の追加

質問・回答の内容は薄く「Q&A項目…」と書かれた欄に追加します。

初期状態では段落ブロックが1つ用意されていますが、段落ブロックを複数使ったり、画像ブロックやその他のブロックを使って質問・回答の内容を作ることもできます。

デザインサンプル

「デザインサンプル」ではFAQラベルのデザインをボタンひとつで設定できます。

好みのデザインを選んだ後、文字の色や枠線の色などを設定しましょう。

FAQラベルのデザイン設定

FAQラベルのデザイン設定

「FAQラベル」の各設定では「Q」「A」と書かれたラベル部分のデザイン設定を変更できます。

文字の太さや色、枠線の有無など、好みに設定しましょう。

「ラベルy表示位置」では「Q」「A」と書かれたラベルの表示位置を変更できます。

初期値では中央になっていますが、複数行の文章を記載する場合は「上」揃えにしておくと見栄えが良くなると思います。

FAQコンテンツ(文章)のデザイン設定

FAQコンテンツ(文章)のデザイン設定

「FAQコンテンツ」設定では、文章の文字色やFAQ項目の背景色・下線などを設定できます。

文字色の設定については、コンテンツ内のブロック(例:段落ブロック)の色設定が優先されます。

FAQ全体設定

全体デザイン設定

FAQ全体設定

「Q」と「A」の項目を囲うブロックの設定では、FAQ全体の背景色や枠線の有無などを設定できます。

開閉設定(アコーディオン設定)

開閉(アコーディオン)設定

「開閉設定」ではページ読み込み時にFAQのQのみ表示して、QをクリックするとAが表示されるアコーディオン方式にできます。

「開閉式にする」をONにすると、Q項目の右側に開閉ボタン(下矢印)が表示され、開閉ボタンの色も設定で変更できます。

デザイン見本

シンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

開閉式

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

ラベル背景あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

ラベル枠線あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

下区切り線あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

背景色あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

背景色・下区切り線あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

全体背景色あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

全体枠線あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

下のみ枠線あり

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

q

質問サンプル質問サンプル質問サンプル

a

回答サンプル回答サンプル回答サンプル

構造化データ出力設定

※現在のバージョンでは構造化データ出力には対応しておりません。
※今後のバージョンアップで対応予定です。