Pickupニュース

WordPress Google Maps Plugin Lite
WordPressプラグイン

WordPress Google Maps Plugin Lite

Google Maps作成・挿入WordPressプラグイン
WordPress Google Maps Plugin Liteはスタイルや座標を設定後、投稿、ページ内にショートコードでGoogle Mapsの地図を挿入するWordPressプラグインです。

プラグインのインストール

  1. 管理画面の プラグイン新規追加 をクリックします。
  2. プラグインの検索からプラグイン名を検索します。
  3. 該当するプラグインの今すぐインストールをクリックしてプラグインをインストールします。
  4. インストール後、有効をクリックして、プラグインを有効化します。
プラグインが有効化されると、ダッシュボードメニューの設定の中に「Intergeo Maps」、メディアの中に「Intergeo Maps」が追加されます。

WordPress Google Maps Plugin Liteの設定

設定Intergeo Maps で、WordPress Google Maps Plugin Liteの設定を行います。

APIキーの入力

設定Intergeo Maps を開き、Maps API Keyを入力します。

Google Maps APIの利用には必ずAPIキーの設定が必要になりました。


Google MapsのAPIキー取得につきましては、以下の記事をご参照下さい。
Google Maps API無償版のポリシー変更が6月22日に発表され、猶予期間が10月12日で終了した。

このポリシー変更は、Google Maps APIを利用しているユーザーにとって大きな影響があり、「突然、ウェブサイトの地図が表示されなくなる」という可能性もあるものだという。

Google Adsense IDの入力

地図上にGoogle Adsenseを表示する際は、Adsense Publisher Idを入力します。


—–
以上入力後、Save Changedをクリックして設定を保存します。

Google Mapsの作成・管理

メディアIntergeo Maps でGoogle Mapsの作成・管理を行います。

Google Mapsの作成

Add Newをクリックして、以下の設定項目を入力後、Create the mapをクリックしてGoogle Mapsを作成します。
Overlays
Markers ツールメニューのマーカーを追加をクリック後、地図上をクリックしてマーカーを追加します。または、右メニューAdd Markerをクリックすると地図の中心にマーカーが追加されます。追加したマーカーはドラッグアンドドロップで移動することが出来ます。
Edit markerをクリックすると、以下Marker Optionsでマーカーを編集します。
Marker Options Enter title マーカーのタイトルを入力します。
Enter address or lat, long マーカーを表示する住所や緯度、経度(例:35.681368,139.766076)を入力します。省略、入力値を認識出来ない場合は、最初に地図上をクリックしてマーカーを追加した座標になります。
Icon マーカーのアイコンを選択します。Customを選択すると画像URLパスを入力して、独自のマーカーを選択することが出来ます。
Content マーカーをクリックした際に表示される情報ウィンドウの内容を入力します。
Polylines ツールメニューの線を描画をクリック後、地図上をクリックしてポリライン(線)を描画します。終点でダブルクリックすると描画が決定します。
Edit polylineをクリックすると、以下Polylines Optionsでポリラインを編集します。
Polylines Options Stroke weight in pixel 線の太さをピクセル単位で入力します。
Stroke opacity from 0.0 to 1.0 線の透明度を0.0~1.0で入力します。
Color 線の色をカラーピッカーで選択します。
Rectangle ツールメニューの長方形を描画をクリック後、地図上をドラッグアンドドロップで長方形ポリゴンを描画します。マウスを離すと描画が決定します。
Edit rectangleをクリックすると、以下Polygon Optionsでポリゴンを編集します。
Polygon Options Stroke options Stroke weight in pixel 線の太さをピクセル単位で入力します。
Stroke opacity from 0.0 to 1.0 線の透明度を0.0~1.0で入力します。
Color 線の色をカラーピッカーで選択します。
Fill options Fill opacity from 0.0 to 1.0 塗りつぶし面の透明度を0.0~1.0で入力します。
Color 塗りつぶし面の色をカラーピッカーで選択します。
Circles ツールメニューの円を描画をクリック後、地図上をドラッグアンドドロップで円形ポリゴンを描画します。マウスを離すと描画が決定します。
Edit circleをクリックすると、Rectangle同様Polygon Optionsでポリゴンを編集します。
Polygons ツールメニューの図形を描画をクリック後、地図上をクリックしてポリゴン(面)を描画します。終点でダブルクリックすると描画が決定します。マウスを離すと描画が決定します。
Edit polygonをクリックすると、Rectangle同様Polygon Optionsでポリゴンを編集します。
Positioning & Zooming
Positioning The initial map type 地図タイプをRoad map(道路マップ) / Terrain(地形) / Satelite(衛星写真) / Hybrid(ハイブリッド)から選択します。
Draggable map チェックして地図のドラッグ移動を許可します。
Zooming Zoom range values ズームを0~19の範囲で指定します。
Scrollwheel zooming チェックしてマウススクロールによるズームを許可します。
Preview settings Lock preview チェックしてプレビュー地図をロックします。
Show map center チェックしてプレビュー地図上にマークを表示します。
Controls
Zoom control Enabled チェックしてズームコントロールを表示します。
Position ズームコントロールの表示位置を選択します。
Size ※機能しません。
Pan control ※機能しません。
Scale control Enabled チェックしてスケールバーを表示します。
Position ※機能しません。
MapType control Enabled チェックしてマップタイプコントロールを表示します。
Position マップタイプコントロールの表示位置を選択します。
Style マップタイプコントロールのスタイルを選択します。
Map types ※機能しません。
Street View control Enabled チェックしてストリートビューコントロールを表示します。
Position ストリートビューコントロールの表示位置を選択します。
Rotate control ※機能しません。
Overview Map control ※機能しません。
Styles
Control’s Styles Width 地図の幅を入力します。
Height 地図の高さを入力します。
Extra Styles 地図にスタイルを追加します。
Predefined Map Styles 定義マップスタイルを選択します。
Custom Map Styles Use custom styles
Directions
Directions 右メニューAdd Directionをクリック後、以下Directions Optionsを入力して地図上にルートを描画します。
Directions Options Start location 出発地点の座標を入力します。
End location 到着地点の座標を入力します。
via 交通手段を選択します。
Layers
Traffic layer チェックして交通状況レイヤーを表示します。
Bicycling layer チェックして自転車道路レイヤーを表示します。
Custom layer ※機能しません。
AdSense Integration
Enabled チェックしてGoogle Adsenseを表示します。※ 設定Intergeo Map の設定でAdSense Publisher Idを入力する必要があります。
Format Google Adsenseのフォーマットを選択します。
Position Google Adsenseの表示位置を選択します。
Styles Background color Google Adsenseの背景色をカラーピッカーで選択します。
Border color Google Adsenseの枠線の色をカラーピッカーで選択します。
Title color Google Adsenseのタイトルの色をカラーピッカーで選択します。
Text color Google Adsenseのテキストの色をカラーピッカーで選択します。
URL color Google AdsenseのURLの色をカラーピッカーで選択します。
Import/Export Markers
Enabled ※Pro版を購入する必要があります。

Google Mapsの挿入

地図のプレビューサムネイル下のショートコードを投稿の記事本文にコピー&ペーストしてGoogle Mapsを挿入します。
WordPress Google Maps Plugin Liteのショートコード
[intergeo id=”{Map ID}”][/intergeo]

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください