【2019年版】ワードプレスプラグインSimple Mapで地図が表示されない時の対処法
住所データからGoogleMapを表示させたいという時、「GoogleMap 住所から表示」なんてググると、まず出てくるのがSimple Mapというプラグインではないでしょうか。(というか、他に出てこない…)
先日、カスタムフィールドの住所データ(東京都港区六本木〇-〇-〇みたいな)を元に、ページ上にGoogleMapを表示しなければならない場面に出くわしました。「Simple Map使っちゃお」と思って、簡単に済む予定でした。しかし、最近のグーグルマップの仕様変更もあり、結構ハマってしまいました。
最近の情報もなかなか見つからないし。。。そこで、今回はSimple Mapが表示されない場合の原因と対処法をまとめてみたいと思います。
~ 目次 ~
APIキーを設定しているか
これはプラグインの唯一の設定項目なので、当たり前ですよね。APIキーを取得してきちんと貼り付けてあるか確認しましょう。
サブドメインのワイルドカードが正常に機能しない?
APIキーを取得するとキーの使用制限をするように促されます。
やっておかないと、誰でも使用できるキーになってしまうので、しっかり制限しておきたいところです。
https://whitewood-hp.com/*
は、思った通りに機能してくれるのですが、
https://*.whitewood-hp.com/*
のように、サブドメインにワイルドカード(*)を入れると、うまく機能しないのか地図が表示されませんでした。
将来的にはちゃんと機能するかもしれませんが、サブドメインサイトでマップを使用する場合は、
https://blog.whitewood-hp.com/*
のように、1つずつ個別に記入した方が良いのかもしれません。
支払い情報を登録しているか
2018年にGoogleMapが有料化?して以来、「支払情報を登録していない場合にどうなるか」という明確な情報が見つかりません。ですが、今回ハマって色々試した結果、支払い情報を登録していないと、表示されなかったり「このページでは Google マップが正しく読み込まれませんでした。」というメッセージが出たりと、他の設定を変えていないにも関わらず、不安定な挙動になりました。
必要なAPIが有効になっているかを確認
最後に、Simple Mapで使用するAPIは、現在の名前で言うと以下の3つのようです。すべて有効になっているか確認しましょう。
- Maps JavaScript API
- Geocoding API
- Maps Static API
Maps JavaScript APIだけでは、すべての機能が使えません。
2番目のGeocoding APIは、住所から位置情報に変換するのに必要です。また、Simple Mapプラグインでは、スマホ表示の場合はStatic Mapを表示する仕組みです。3番目のMaps Static APIはスマホ表示に必要になります。
全部有効にしていなくても表示されるケースを見かけましたが、いずれも安定しません。表示されたと思ったら、またダメになったりしてしまいます。
最後に
ちゃんとSimple Mapで設定したグーグルマップが表示されるようになったでしょうか?
この記事を書いている時点で、Simple Mapは1年ばかり更新されていないようです。
ですが、以上の点に注意して設置すれば、問題なくちゃんと表示されました。住所から表示させるのって、(私のような)APIの素人には大変ですよね。ここはなんとか!Simple Mapを使って楽に済ませましょう。。。