【WordPress】ウェブサイトにグーグルマップを表示。GMO Google Map

gmo_google_map_s
GMO Google Mapはショートコードを使ってウェブサイトにグーグルマップを表示できるプラグイン。

GMO Google Mapプラグインを導入

ダッシュボード >> プラグイン >> 新規追加 >> GMO Google Mapを検索
有効化にすると設定にGMO Google Mapが追加されます。

GMO Google Map

gmo_google_map_1
必要項目を入力していきます。空白でも問題はないようです。

Address 住所(日本語でいけました。)
Width 幅(入力しなければ100%)
Height 高さ(入力しなければ200px)
Zoom ズーム
breakpoint ブレークポイント

Saveをクリックするとショートコードが更新されますので、ページや投稿にコピペしたら完成です。

gmo_google_map_2
上記のショートコードとソースは下記のようになります。
[map addr="福岡県福津市上西郷779−1" width="900px" height="600px" zoom="17" breackpoint=""]

<div class="gmogooglemap"><div data-breakpoint="480" data-lat="" data-lng="" data-zoom="17" data-addr="" style="width:900px;height:600px;">福岡県福津市上西郷779−1</div></div>

Snazzy Mapsプラグイン

gmo_google_map_3
Snazzy Mapsプラグインを使ってマップスタイルをカスタマイズしてみました。

 
GMO Google Map

【WordPress】ウェブサイトにグーグルマップを表示。GMO Google Map

  • LATEST
  • RELATED
  • POPULAR