Word Press Simple Map グーグルマップが表示されない! 原因はAPIキー入力方法

スポンサーリンク

Word Pressはトラブル続きでございます。初心者には厳しい道のりですねー(;’∀’)

グーグルマップが表示されない!

絶対に地図を表示したいのに~
他のみんなはバンバン地図のせてるのに~
なんで自分のサイトだけ表示されないんだ~・・・半泣き状態 (-_-;)

いろいろ調べました。

やってみたこと (;´∀`)

①グーグルマップ表示のプラグインを別のものに変える。simple map→別のものをインストールしても改善されず。

②グーグルマップ表示にはAPIキーの登録が必須になったっていうので、もちろんAPIキーも登録しました。→改善されず

③グーグルのAPIキーってなんだか たくさんあるみたいで、たくさん取得してみた。

Google Maps API

Google Maps Android API
Google Maps SDK for iOS
Google Maps JavaScript API
Google Places API for Android
Google Places API for iOS
Google Maps Roads API

→ 無謀でしたが、やはり 改善されず

解決策 原因発見 ↓

初心者はここでつまづきました。
Google Maps APIs for Webで、APIキーを取得する際、グーグルマップを表示させるURLを入力するのですが、
そこに大きな落とし穴がありました。
「このHTTPリファラー(ウェブサイト)からのリクエストを受け入れる」
の欄でグーグルマップを設置するURLを入力しますが、
ここの入力欄にはグレーの文字で入力例がはいっていたので、
そのとおりにワイルドカード( * )も入れてましたが、なんとこれが原因でした!!→ APIキーのサイト入力で、/*  */を省いたらなんとすんなりOK!グーグルマップが表示されるようになりました。 

*.example.com/* でもダメ
.example.com/* でもダメ
example.com/* でもダメ、

私のサイトの場合、example.com と入力したらOKになりました!!

その後、表示は自動で後ろに /* がついて変わってましたがね。自分で入力したのはexample.comだけです。

(exampleの部分はもちろん自分のサイト名に変えてください。)

初心者にはよくわからないことですが、解決できてよかったです。(;´∀`)

More from my site