住所だけで簡単にグーグルマップをサイトに表示させる方法

グーグルマップ自動表示1

地図を表示したいサイトを作成する時は、いつもグーグルマップを使っています。
グーグルマップを使うと、複数のポイントをプロットしたも簡単に作れます。
表示される地図の拡大・縮小なども簡単にできるし、グーグルマップはとても便利です。
たとえばこんな風に使っています→泉大津の避難所

1つのサイトの中に、少ししか地図を貼り付けない時は、グーグルマップのページで埋め込みようのタグを取得して1枚づつ貼り付けるのはそれほど面倒ではありません。

でも・・・ほとんどのページに地図を埋め込むようなサイトだと、地図のタグを作る作業はかなり面倒です。
例えばこのサイト。1ページづつ地図の埋め込みタグを作って貼り付けていました。
 →ライオン株式会社大阪工場の工場見学

知らなかったのです。
住所だけでグーグルマップを自動的に表示する方法を・・・涙

でももう大丈夫!

住所入力だけで、サイトにグーグルマップを自動表示する方法を学んだのです。

MTの記事投稿画面に住所を書くと・・・
こんな感じでページに埋め込み地図が表示されます。

グーグルマップ自動表示1

めちゃくちゃ楽チンです。作業効率大幅アップです!!

方法は、とっても簡単。MTのMapperというプラグインを利用したのです。
*WPにも同じようなプラグインがあります。

Mapperプラグインはここでダウンロードできます。
 →Mapperプラグイン

使い方は簡単。

  1. プラグインをMTに設置します。
  2. グーグルマップのAPIキーを取得します。
    グーグルマップのAPIキー取得はこちら
  3. MTのプラグイン管理画面で、MapperプラグインにグーグルマップAPIキーを入力します。
  4. 地図を表示させたいページのテンプレートの、地図を表示させたい部分を、Mapper用のタグ <MTMapper> </MTMapper> で囲みます。 
  5. 地図を表示させたい場所に、地図を表示させたい場所の住所を  [map:住所] のように書きます
  6. 地図が表示されます!

詳しい使い方はMapperプラグインのページに書いてあります。→Mapperプラグイン

参考までに、私が設定したときのスクリーンショットを貼っておきます。
Mapperプラグインの設定画面(MTのプラグイン設定のところ)

グーグルマップ自動表示2

Mapper表示用のタグを設置したテンプレート。
個別記事のページに地図を表示したかったので、「ブログ記事」のテンプレートに設置。

グーグルマップ自動表示3

実は最初、ちょっとしたミスで地図が表示されず困ってしまった私。
間違えて書いていたのはこれ

グーグルマップ自動表示4

正しくはこうでした。<p>タグでもOKです。

グーグルマップ自動表示5

間違った住所を書くとどうなるのか気になったので、わざと間違えてみたら、こうなりました。

グーグルマップ自動表示6

MTにたった1つのプラグインを入れただけで、作業効率大幅アップ!
うれしいですね♪

さくらが学んだこと
作業効率のアップはとても大事。
MTやWPにはいろいろなプラグインがある。
作業効率アップを常に心がけ、便利なツールはどんどん活用しよう。




この記事へのリンクはご自由にしていただけます。下枠内のリンク設置用タグをご利用ください。
<a href="http://xn--u9j463gmxy003a.com/web/mt/googlema.html" target="_blank">住所だけで簡単にグーグルマップをサイトに表示させる方法</a>

コメントは、Facebookアカウントを通してのみとなっております。