ワードプレスサイトにGoogleの口コミを埋め込む方法

ワードプレスサイトにGoogleの口コミを埋め込む方法

※この記事にはプロモーションが含まれています

Googleマップで表示される口コミをワードプレスサイトに埋め込む方法を、ご紹介します。

店舗型ビジネスの場合は特に、SEO対策と並んで重要視されるようになったMEO対策。

MEO対策と並行して、お考えになると良いですね。

目次

ワードプレス(Wordpress)サイトにGoogleの口コミを埋め込む方法

以下、6ステップで進めていきます。

  1. Google Cloud Platform のアカウント作成する
  2. Places APIを有効化する
  3. APIキーを作成して、キー制限をする
  4. Google Maps Platform/Place IDs で<実店舗ID>を取得する
  5. プラグイン「Widget for Google Reviews」でショートコードを生成する
  6. ショートコードを任意の場所に設置する

1.Google Cloud Platform のアカウント作成する

まずは、Google Cloud Platform のアカウントを作成ください。

上記、右上の「無料で開始」ボタンを押してすすめてください。Googleアカウントがあれば、すぐに登録できます。

Google Cloud プラットフォーム画面

こちらがGoogleクラウドのメイン画面。(※2024年4月現在)

バージョンアップされている場合、画面が異なる場合があります。

2.Places APIを有効化する

Google Cloud Platformのダッシュボードを開きます。

Google Cloud Platformのダッシュボード

「APIとサービス」>「ライブラリ」と進めていくと下記のような画面になると思います。

Google Cloud Platformの「Place API」

「Places API」をクリックすると、APIを「有効にする」ボタンがあるので、有効にしてください。

「Places API」を有効にする

3.APIキーを作成して、キー制限をする

「Places API」を有効にすると、APIキーを発行できるようになります。

Google Cloud Platform>APIとサービス>鍵と認証情報

上記画面のように「APIとサービス」>「鍵と認証情報」と進めていくと、下記のような画面になるかと思います。

「APIとサービス」>「鍵と認証情報」

上記画面の「+認証情報作成」をクリックすると、ウインドウが出ますので「APIキー」を選択してください。

「+認証情報作成」を押してAPIキーを作成

するとAPIキーが作成されます。なお、この時点でコピーして控えておかなくても大丈夫です。続いて「APIキーを編集」のリンクをクリックします。

画面が切り替わるので、任意のわかりやすい名前「google_review」など付けていただいて、下にスクロールすると下記のような画面になります。

APIキーを編集

キーを制限にチェックし、APIを選択できますので「Places API」を選び、保存すれば完了。

「鍵を表示します」をクリックすると、APIキーが表示されます。このキーは後ほど使用しますので、ウインドウをこのままにしておくか、メモ帳などに控えておいてください。

4.Google Maps Platform/Place IDs で<実店舗ID>を取得する

Google Maps Platform > Place IDs

上記リンクのグーグルマッププラットフォームのPlace IDsで、口コミを掲載したい店舗の地図IDを取得します。

Google Maps Platform/Place IDs

ここでは、仮に東京の「八王子駅」とします。

直接住所を入力しても出てこないことがあるので、検索する形の方が出てきやすいですね。たとえば、「東京 八王子 駅」と入力するようにすると、候補が出るので「八王子駅」を選択します。

上記のプレイスIDをコピーして、控えておいてください。

5.プラグイン「Widget for Google Reviews」でショートコードを生成する

下記、「Widget for Google Reviews」というプラグインをインストールして、有効化します。

次に、上記プラグインの「Settting」編集画面に、STEP3で生成したAPIキーをコピペします。

今度は、「Widgets」編集画面で、「Create Widget」ボタンを押して、新しいレビューを表示させるウィジェットを作ります。

画面右上の「CONECT GOOGLE」ボタンを押し、STEP4で生成したプレイスIDをコピペします。言語は「Japanese」を選択。そして、「Conect Google」を押せば完了です。

6.ショートコードを任意の場所に設置する

あとは、上記で生成されたショートコードを、記事に挿入すれば表示されます。

画面右側のメニューでカンタンなデザイン調整ができますので、設置するサイトに合わせて、調整してください。下記が実際に、上記のショートコードを埋め込んだ時の事例です。

八王子駅
3.7
Based on 945 reviews
powered by Google
Shigezou ChibaShigezou Chiba
13:56 25 May 24
八王子駅は、中央線(快速・特急)、八高線、横浜線が乗り入れるターミナル駅です。神田駅から中央線特快に乗り(神田駅から八王子駅まで約50分)、北口側にある「八王子市夢美術館」を訪れる際に利用させていただきました。ターミナル駅で特急も停車する駅なので、駅内も駅周辺も人の量が凄く😱💦、とても賑わっていて活気を感じました❗️何か催し物をしていたのか、ユーロードという歩行者専用道路は人で溢れかえっていました😅💦
yasuhiro yamadayasuhiro yamada
13:40 25 May 24
直々です直々です
18:40 23 May 24
それなりの駅ですよ
いしてついしてつ
09:45 17 May 24
ツマダマンツマダマン
10:08 15 May 24
X10 XPERIAX10 XPERIA
06:15 12 May 24
YやまおYやまお
01:22 09 May 24
2人で『 』2人で『 』
05:52 08 May 24
駅員の態度が悪かった
通りすがりに撮影しました。広い駅の様でした。
Mai GiàuMai Giàu
03:09 07 May 24
駅も大きくて、隣にはビックカメラもありとても便利です。
福澤敏美福澤敏美
15:42 05 May 24
改札口が沢山あり❔
Garaiya GTGaraiya GT
06:05 05 May 24
どこにでもある不味い蕎麦屋とキオスクがある以外、何も無い。
JR八高線、横浜線、中央線の主要接続拠点。駅の外にある京王線へのアクセスは、標識に従ってください。門の外にはたくさんのショップ、カフェ、レストランがあります。普段はとても混んでいますので、気をつけて通勤してください。
Y ToshimaY Toshima
00:17 02 May 24
東京都、西の要所。
Ibnu AbigaelIbnu Abigael
16:20 01 May 24
駅は広い、駅の前は色々な場所があります、食やとか、カラオケとか、良い駅です
KojiKoji
02:35 01 May 24
Z2オヤジZ2オヤジ
04:05 30 Apr 24
広々としていますね!仕事で良く来ます。
ぬるまゆぬるまゆ
07:53 26 Apr 24
公徳中島公徳中島
04:38 21 Apr 24
普通の駅です。駅内の店が増えました。
立派な駅で周辺の施設も充実しています!#ウンポポ
yosuke Satoyosuke Sato
12:57 16 Apr 24
駅も大きいですが、駅ビルセレオを中心に駅前はとても大きな都市です。約500m徒歩5~6分離れたところに、京王線八王子駅もあります。駅の中には山梨の信玄餅のお店などもあり、雰囲気も東京中心部よりも東京西部から山梨県の雰囲気も感じさせます。多摩地域最大の人口を擁する八王子市の中心駅であり多摩地域にあるターミナル駅の一つだけあって、東京から山梨方面へを結ぶ「中央線」、神奈川県横浜方面から八王子へと結ぶ「横浜線」、埼玉県川越から八王子を結ぶ「八高線」が乗入れし、「かいじ」「あずさ」「富士回遊」「はちおうじ」などの特急列車も全て停車する。大学も創価大学、中央大学、東京都立大学、工学院大学等があり学園都市としての駅の役割も果たしています。改札中にはお蕎麦屋さんやお土産コンビニも、改札を出れば駅ビルセレオ、地下には駐車場や駐輪場も完備され、国道20号から駅までは地下道で結ばれている為、雨でも濡れないでアクセスすることが出来とても便利です。
yoshiyuki nakaiyoshiyuki nakai
07:24 17 Mar 24
羽村の自動車工場に出張時に乗り換えで利用しました。関西人の私でも知っている有名な駅です。乗り換えに使っただけですが、買い物など便利そうで、住みやすそうです。
大
07:38 15 Feb 24
乗降客の多さと比較すると、中央線下りホームの狭さが気になります。改札口へ向かう階段エスカレーターも混み合います。暁町の萩生田光一宅や、裏金男が生稲晃子を連れてった子安町の統一教会施設の最寄駅です。
博之小沼博之小沼
10:53 10 Jan 24
多方面への乗り換えに優れた駅です東京や新宿からも快速や特別快速で一本で観光地の松本や上諏訪までも特急使えば1本です、ちなみに近くには京王八王子駅があり他鉄道会社ですが新宿までは申し分ないくらいの利便性の良さでたまにゲリラ的な事に遭遇して長野総合車両センターへの廃車車両の輸送とか西武車両の輸送とか東急車両の輸送等があり、撮り鉄がいる時はかなりのレアな車両が通ると見ても良いかと
3路線(中央本線、八高線、横浜線)4方面が乗り入れ、中央本線の西(山梨)方面から来る列車の終点になることも多い運転上の要衝だけあって構内は広大です。京王電鉄の八王子駅とは少し離れています。(徒歩5分程度)

ただ、無料のサービスのため、限界はあります。今後、サービス提供が廃止になる可能性もあるので、その際はご了承ください。

まとめ

この記事では、ワードプレスサイトにGoogleマップの口コミを埋め込むための詳細な手順をご紹介しました。店舗型ビジネスにとって重要なSEO対策とMEO対策を強化するための一環として、口コミの可視化は非常に効果的です。

この方法を利用すれば、ユーザーに対して信頼性を高め、より具体的な情報提供が可能になります。ぜひご参考ください。

ご登録いただくと、月1~2回、更新通知を送らせていただきます。

ご登録いただくと、月1~2回、更新通知を送らせていただきます。

「良いな」と思ったらシェアしてください!損はさせません
  • URLをコピーしました!
  • URLをコピーしました!
目次