【WordPressにGoogleマップのストリートビューを表示させるプラグイン】

WordPressにGoogleマップを表示させたい(埋め込みたい)場合ってあると思います。

企業サイトだったら、「うちの会社はここです」みたいな使い方もされることが良くあると思います。

そこで、ただGoogleマップを埋め込むのではなくて、ストリートビューとして埋め込んでおくと、

  • 「ああやって、こうやってたどり着けばいいのか~」や
  • 「歩くとこんな感じの景色なんだな~」など

その場所の雰囲気が掴めたりして、たどり着きやすくなるかもですね。

今回は、そのGoogleマップのストリートビューをWordPressに埋め込むプラグインをご紹介します。

プラグインのインストール&有効化

ではでは、早速プラグインをインストールしましょう。WordPressの管理画面から、「プラグイン」→「新規追加」で「Simple Google Street View」と入力してプラグインを検索します。

下の画面が表示されるので「いますぐインストール」を押します。

インストールしたら、有効化で完了です。

※FTPからファイルをアップロードされたい場合は、こちらからzipファイルをダウンロードできます。

インストール、有効化が完了しましたら、さっそく設定をしましょう。

設置はとても感覚的にできます

設定は記事か固定ページの編集画面で行います

アップロード/挿入の欄に新しくアイコンが追加されています。クリックしましょう。

場所を選びます

例えば、「東京駅」と入力します。入力後、「Show on map」をクリックします。

周辺地図が表示されました

ペグマンを配置しましょう

この人型のアイコンってペグマンって呼ぶそうです。これをドラッグして地図に置きます。

置きかたのコツですが、下のようにペグマンの色がグレーになった場合は配置できません。

下の画像のように、青色になっている道路上に置きましょう。プレビューにも画像が表示されていますね。

無事に配置したら、微調整しましょう

東京駅に一番近い道路に配置しました。すると下の画面が表示されます。が・・・なんだかこれじゃあわからないですね。画像をドラッグしたり、位置を変更して微調整しましょう。

こんな感じに調整しました。なんとなくわかりますかね・・・。これでOKならば、「Add This View」をクリックします。

下のようなコードが自動で貼り付けられます。

表示幅、高さなどを変更したい場合は、発行されたタグのパラメーターの「width」「height」の数字を変更するなどで調整をすればOKです。

これで設置は完了です。

まとめ

というわけでして、WordPressでGoogleマップのストリートビューを表示する方法はいくつかありますし、プラグインもけっこう出回っていますが、このプラグインがかなり感覚的にできて特にすばらしいと思います。

興味がありましたら、是非おためしください。

著者:bouya Imamura