掲載

お客様の声をホームページに載せる方法

せっかく集めたお客様の声も、載せ方しだいで効き目が大きく変わります。同じ感想でも、ベタ書きのテキストとして並べるのと、星評価つきのカードで見せるのとでは、伝わる信頼感がまるで違います。この記事では、声を「テキスト直貼り」する場合の限界と、埋め込みコードで星評価つきカードを自動表示する手順、そして WordPress・STUDIO・ペライチでの貼り方の勘所までをまとめて解説します。


なぜ「載せ方」で差がつくのか

お客様の声がいちばん効くのは、申し込みボタンを押す直前です。料金やサービス内容を読んで「よさそうだけど、本当に大丈夫かな」と迷っている瞬間に、自分と同じ立場の人の「頼んでよかった」という一言が背中を押します。逆に、声があっても見づらかったり、いかにも自作っぽい雰囲気だと、せっかくの安心材料が働きません。だからこそ「集める」だけでなく「どう見せるか」が成果を左右します。

テキストを直接貼るだけだと、もったいない理由

最も手軽なのは、いただいた感想を本文にそのままコピペする方法です。すぐに始められる一方で、次のような弱点があります。

  • 更新が面倒:新しい声が届くたびに、ページを開いて手で貼り付ける作業が発生します。忙しいと結局そのまま放置されがちです。
  • 本物感が弱い:本文に溶け込んだ文字列は「自分で書いたのでは?」と疑われやすく、第三者の声としての説得力が下がります。
  • 星や写真が出しにくい:★5つの評価や投稿者のアイコン、日付などを手作業できれいに並べるのは手間がかかり、結局テキストだけになりがちです。
声が3〜4件のうちは直貼りでも十分ですが、件数が増えてきたら「自動で並ぶ仕組み」に切り替えると、管理がぐっと楽になります。

おすすめは「埋め込みウィジェット」で自動表示

おすすめは、お客様の声を管理しているツールが発行する埋め込みコードを、ページに一度貼っておく方法です。承認した声だけが星評価つきのカードで自動的に並び、新しい声を承認すれば、ホームページ側は何も触らなくても表示が更新されます。デザインも整っているので、見た目で信頼感を出せます。Koevita でも、集めた声をそのままサイトに貼れる埋め込みコードを用意しています。

声を貼る「場所」で効果が変わる

同じ埋め込みコードでも、置く場所で効き目が変わります。次の3か所を意識すると無駄がありません。

  • トップページ:来訪者が最初に見る場所。サービスの第一印象に「実績がある」という安心を添えます。
  • サービス紹介・料金ページ:内容を読んで検討している人に、すぐ近くで第三者の評価を見せられます。
  • 申し込みページの直前:最後のひと押し。ボタンのすぐ上に声を置くと、迷いを減らせます。

主要サービス別・貼り方の勘所

埋め込みコードは、たいてい次のような1〜数行の HTML です。これをページの貼りたい場所に入れるだけで表示されます。

埋め込みコードの例(イメージ)
<!-- お客様の声ウィジェット -->
<div id="koevita-testimonials"></div>
<script src="https://koevita.com/embed/あなたのID.js" async></script>

1WordPress:カスタムHTMLブロックに貼る

ブロックエディタで「+」からカスタムHTMLブロックを追加し、そこに埋め込みコードを貼り付けます。通常の「段落」ブロックに貼るとコードが文字としてそのまま表示されてしまうので、必ずカスタムHTMLブロックを使ってください。固定ページでも投稿でもサイドバーのウィジェットでも同じ要領です。

2STUDIO:埋め込み(HTML)要素を置く

編集画面で「埋め込み」(HTMLを貼れる要素)を追加し、コードを入力します。配置したいセクションにドラッグして、幅や余白をまわりのデザインに合わせて整えると自然になじみます。プレビューで実際の表示を確認してから公開しましょう。

3ペライチ:HTMLブロックに貼る

ブロックの追加からHTMLを埋め込めるブロックを選び、コードを貼ります。料金や申し込みフォームのブロックの近くに置くと、検討中の人の目に入りやすくなります。

どのサービスでも共通のコツは「貼ったら必ず実機で表示確認」。とくにスマホ表示は、公開後に自分のスマホで一度開いてみると安心です。

うまく表示されないときのチェックポイント

サービスによっては、セキュリティの都合で貼り付けた<script> が自動的に削除されることがあります。「コードを貼ったのに何も表示されない」「保存したらコードが消えている」場合は、これが原因のことが多いです。その場合は、専用のHTML埋め込み要素を使う、プランを見直す、あるいはツール側が用意している iframe 形式の埋め込みに切り替えると解決することがあります。困ったときは、提供元のヘルプや問い合わせ窓口に「どの埋め込み形式に対応しているか」を確認するのが近道です。

よくある質問

Q. HTMLが分からなくても貼れますか?

はい。やることは「発行された埋め込みコードをコピーして、指定の場所に貼り付ける」だけで、コードの中身を理解する必要はありません。WordPressならカスタムHTMLブロック、STUDIO・ペライチならHTML埋め込み要素に貼るだけです。どうしても不安なら、まず1ページだけで試して表示を確認してから本番に広げると安心です。

Q. スマホ表示は崩れませんか?

埋め込みウィジェットは、画面幅に合わせて自動でカードの並びが変わるよう作られているものがほとんどなので、基本的にスマホでもきれいに表示されます。心配な場合は、貼り付けたあとに自分のスマホで実際に開いて確認しましょう。横スクロールが出る・はみ出す場合は、貼った要素の幅設定(100%になっているか)を見直すと直ることが多いです。

まとめ

お客様の声は「集める」だけでなく「どう載せるか」で成果が変わります。テキスト直貼りは手軽ですが、更新の手間・本物感の弱さ・星や写真の出しにくさが弱点。承認した声が星評価つきカードで自動表示される埋め込みウィジェットなら、貼るのは一度きりで、あとは更新の手間がかかりません。トップ・サービスページ・申し込み直前に置き、公開後はスマホ表示までしっかり確認しておきましょう。

関連記事: お客様の声の集め方|依頼メールの文例つき5ステップ

関連記事