WordPressとGoogleMapsを連携させる最強プラグイン「Geo Mashup」

地図を単に表示させるだけじゃない。記事に位置をひも付け、ひとつの地図上にすべてを表示することなどが出来る。GoogleMaps最新のV3に対応しています。2005年にリリースされた老舗プラグインながら、2013年2月26日にもアップデートされバージョン1.5.3を迎えました。GeoCMSを作るならばうってつけのこちら、さくっとご紹介していきます。

thumb_MDGC8469_1024

Geo Mashupとは

とりあえずプラグインページを参考に特徴を列記します。

  • 投稿やページなどに位置情報を付与できる
  • Google Maps v3もしくはOpenStreetMapを地図データとして使う
  • GeoRSSが自動で付与される

など。機能の完全なる説明はDocumentationをチェックしてみてください。

なぜ使うの?Geo Mashup

BuddyPressもそうだったけれど、こちらもなかなか知られていないプラグイン。日本語説明ページなんて皆無に等しいこの状況でなぜ使うのか。私が運営している杉並区おた助は地域サイトで、「場所」というメタデータがいかんせん無視できなかったからです。

お店の紹介が大事なコンテンツになるわけだけれども、記事下部に住所列記したりGoogleMapsにリンクしたりでは何やら物足りない。ひとつの地図に記事のあるお店をすべてプロットして一覧できたら楽しいなーと。それが理由です。

そしてそれが出来るのがGeo Mashupなのです。簡単に、GeoCMSが出来てしまうのです。

杉並区おた助での設定例

それでは実際の導入レポートです。インストール後、設定>Geo Mashup>Overallでは全体のことを決めます。

  • Map Provider:Google V3。V2はもうすぐ無くなるそうです
  • Google API Key:ここを参考にAPIキーを取得します
  • Global Mashup Page:総合ページをどこに作るか
  • Collect Location For:投稿、固定ページ。どこから位置情報を取得するか
  • Enable Geo Search:checked。位置検索ウィジェットを有効にするか。あまり使えないかも
  • Include Taxonomies:カテゴリー。何を対象とするか、パフォーマンスのためには最小限に
  • Copy Geodata Meta Fields:unchecked。位置情報を他にも使うか
  • Geocode Custom Field:none。カスタムフィールドに入れるか
  • Enable Reverse Geocoding:none。リバースジオコーディングを可能にするか
  • Use Theme Style Sheet with Maps:none。
  • Obscure Settings:no touch。

続いてSingle Mapsタブでは個別記事に入れる地図のことを決めます。全てデフォルト値のままです。

  • Map Width Pixels, or append %.:100%
  • Map Height px:200px
  • Map Control:Small Zoom 3D。地図コントローラーのことですね
  • Default Map Type:Roadmap。他にも衛星写真などから選べます
  • Add Map Type Control:unchecked。衛星写真などの選択肢を与えるかどうか
  • Add Overview Control:uncheked
  • Enable Scroll Wheel Zoom:unchecked。これを有効化するとページスクロールと干渉して面倒そうです
  • Default Zoom:14
  • Click To Load:unchecked。速度対策にはなるかもしれません
  • Click To Load Text:none。ここに入力したテキストをクリックすると地図が表示されます

さらに、このプラグインならではの機能「Global Maps」タブを設定します。

  • Map Width Pixels, or append %.:100%。横幅いっぱいに広げたいため
  • Map Height px:470px。適当に
  • Map Control:Small Zoom 3D
  • Default Map Type:Roadmap
  • Add Map Type Control:unchecked
  • Add Overview Control:unchecked
  • Enable Scroll Wheel Zoom:unchecked
  • Default Zoom Level:14。実際に見て調整したほうがいいです
  • Marker Selection Behaviors:全てchecked。実際に見て調整を
  • Automatic Selection Selects:checked。自動的に最新のひとつを選択状態にするか
  • Show Only Most Recent Items:unchecked。最初のいくつを表示するか。空欄で全部
  • Show Future Posts:No
  • Click To Load :unchecked
  • Click To Load Text:none
  • Category Color:カテゴリごとのマーカーの色を決められます

次のContextual Mapsはコードで記事外に入れるときの設定です。ほぼ同様な項目なので割愛します。

さて実際の設置はショートコードやPHPを使って貼付けるだけ。記事ごとに設定した位置情報が反映され、ひとつの「地図」という世界で記事を一覧できます。マーカーをクリックすると記事タイトル、抜粋などが表示されるという仕組みです。

ただこちらのプラグイン、レスポンシブ対応をどうすればよいのか、無知な私には分からなかったので導入を見送っています。とはいえ使い方次第では面白いものができそうなGeo Mashup、ちょっと覚えておいても損は無いかもしれませんよ。またちなみに、冒頭の画像は本プラグインとは全く関係ありません。

©2017 まちいく

Log in with your credentials

Forgot your details?