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

Google Mapsの挿入

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

コメントを残す

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

記事ランキング