この記事で解決できること
- WordPressで作った診断を固定ページに設置する方法
- ショートコードとブロックの使い分け
- LPや通常ページに置くときの注意点
- 設置後に確認したいポイント
結論:設置は簡単。だからこそ「どこに置くか」で成果が変わる
WordPressで作成した診断コンテンツは、固定ページや投稿に設置できます。
最も分かりやすいのはショートコードで埋め込む方法で、ブロック対応があればエディタ上から配置することも可能です。
設置そのものは難しくありませんが、実際は配置場所と前後の導線設計のほうが成果に影響しやすいです。
よくあるのは、診断を作っただけで満足してしまい、ページ上では読者が気づきにくい位置に置かれているケースです。
また、読者の関心が高まっていない段階や、文脈と合わない場所に置いても利用されにくくなります。
設置場所・導入文・結果後のCTAまでまとめて考えて配置することが重要になります。
固定ページ設置が必要になる理由
診断コンテンツは、管理画面内だけで作っても読者には届きません。
公開するには、固定ページや投稿、LPの中に組み込む必要があります。
特に次のような場面では、固定ページ設置が重要です。
- 商品やサービスの案内ページに置きたい
- LPの途中で診断を開始してもらいたい
- 記事末から診断へ誘導したい
- 問い合わせ前の絞り込み導線に使いたい
日々のブログ記事(投稿ページ)に埋め込むこともできますが、サイトの資産として長く残るサービス案内やLPは固定ページで作ることが多いため、診断の設置先も固定ページのほうが管理しやすくなります。
基本の設置方法
固定ページへの設置は、次の流れで進めると分かりやすいです。
- 管理画面で設問セットを作る
- 設問と結果コンテンツを登録する
- 対象ページを作成する
- ショートコードまたはブロックで埋め込む
ショートコードで設置する方法
最もシンプルなのはショートコードを使う方法です。
[mqs_simulator id=”設問セットID”]
このショートコードを固定ページ本文に貼ると、その場所に診断コンテンツを表示できます。
ショートコード方式の良いところは、旧来のエディタや、テンプレート内など、ブロックが使えない場所でも設置できる点です。
ブロックで設置する方法
ブロック対応があるなら、ブロックエディタから診断を配置することもできます。
専用ブロックが用意されている場合は、編集画面の「+」ボタンから呼び出して配置できます。
この方法は、編集画面内で配置位置を把握しやすいのが利点です。
プレビュー機能がある場合は、前後の文章との見え方も確認しやすくなります。
ブロック設置が向いているのは次のようなケースです。
- ノーコードで管理したい
- 複数ページへ配置したい
- 編集担当者がショートコードに慣れていない
ページ上での配置ポイント
診断をどこに置くかで完了率はかなり変わります。
よくある配置パターンは次の3つです。
1. ファーストビュー直下
「自分に合うかをすぐ知りたい」人には相性が良い位置です。
LPやサービスページで、比較より先に体験してもらいたいときに向いています。
商品数が多く、診断結果からアンカーリンクで比較表や詳細説明に飛べるようにしておくと、CVにつながりやすくなります。
CVとは、Conversion(コンバージョン)の略で、問い合わせ・購入・資料請求など、ページ上で達成したい行動のことです。CV率は、訪問者数に対してどれくらいCVが発生したかを示す割合です。
2. 比較説明のあと
商品やプランの違いを少し説明した後に置く形です。
比較表だけでは選びにくいと感じた人を診断へ流しやすくなります。
ある程度内容を見た後で、さらに自分に合うかを知りたい人がいるので、比較説明の後に置くのも自然な流れになります。
3. 記事末やCTA手前
ノウハウ記事の読了後に、次の行動として診断へ進めたいときに使いやすいです。
記事で悩みを整理してから診断へ入るので、意外と自然につながります。
記事を読んで興味を持った人に案内できる位置なので、診断へ進んでもらいやすい導線になります。
結果後のCTAも置きやすいので、CVにつなげやすいのもメリットです。
設置前後で確認したいこと
ページの前後に短い導入文を置く
診断の前に次のような一文があるだけで、開始されやすくなります。
- 3分でおすすめプランが分かります
- 条件に合う案内だけを表示します
- まずは簡単な質問に答えてください
実際は、診断が突然始まるより、何が分かるかを先に書いたほうが安心されやすいです。
結果画面の次の行動を決める
結果表示だけで終わらせると、ページ上の導線が切れやすくなります。
結果コンテンツには次のどれかを入れておくほうが強いです。
- 商品詳細ページへのリンク
- 問い合わせボタン
- Contact Form 7 のフォーム
- 資料請求ボタン
スマホ表示を確認する
実際によく詰まるのは、PCでは自然でもスマホだと余白やボタン位置が崩れることです。
特にLPでは、周辺デザインとの兼ね合いを最後に確認したほうが安心です。
向いているケース / 向いていないケース
向いているケース
- 固定ページやLPに診断導線を追加したい
- ノーコードで埋め込みたい
- 比較表の代わりに質問導線を置きたい
- 問い合わせ前の絞り込みに使いたい
向いていないケース
- 複雑なテンプレート制御を前提にした完全個別実装
- ページ構造なしで診断単体だけを置きたいケース
- 結果後の導線を用意しない運用
テンプレートや外部呼び出しで置く場合の注意
ノーコードの場合、下記内容は関係ありません。
固定ページ本文に置くなら比較的シンプルですが、テンプレートや外部呼び出しではCSS / JSの読み込みに注意が必要になることがあります。
既存サイトの構成によっては、本文内に置いたときと同じ見え方にならない場合もあります。
よくあるのは、本文以外の場所に入れた結果、必要なアセットの読み込みや余白調整が必要になるケースです。
最初は通常の固定ページで形を固め、その後に特殊な配置へ広げるほうが安全です。
まとめ
WordPressで作った診断コンテンツは、簡単に固定ページや投稿に設置できます。
ただし、重要なのは設置作業よりも「どこに置き、どう始めてもらい、結果後にどう動いてもらうか」です。
開始数や完了率を見ながら、ページ内での位置、導入文、結果後のCTAを調整していくことで、より成果につながりやすい導線にできます。
最初は通常の固定ページで配置を固め、開始率や完了率を見ながらLPや他ページへ広げる進め方が現実的です。
