マップのピン

好きな場所にピンを立てた地図をブログに載せる方法

意外と分かりにくい地図の載せ方

ブログを書いているとこの場所を地図で載せたいって思うことも多いですよね。そんな時、すでにGoogleマップに登録されている場所は比較的簡単に載せることができます。でも登録されていない場所を載せたいっていうことだってあるじゃないですか。たとえば”ここで強盗に襲われた”っていう場所とか。

こんな時に自分で好きな場所にピンを立てて、その地図をブログに載せる方法をご紹介します。ちなみにピンっていうやつはこういうやつです。場所を指し示す目印ですね。

マップのピン

マップのピン

地図上にピンを立てよう

1. まず自分がピンを立てたい場所をマウスでクリックします。そうするとグレーの小さなピンマークが表示されます。

グレーのピンが表示されます

グレーのピンが表示されます

2. 画面の左上の検索欄にクリックした場所の情報が表示されるので、経度、緯度の数字をクリックします。この時に注意することは数字をクリックするっていうこと。ピンをクリックしてしまうと自動的に近くの別の場所にピンが立ってしまうんです。

経度・緯度をクリック

経度・緯度をクリック

3. これで無事に思った場所にピンが立ちましたね。

20150808_Map4

ブログに貼り付けるコードを取得する

次にブログに貼り付けるためのコードを取得します。

1. 検索蘭にさっきクリックした経度と緯度が表示されているので、右側にある三本の棒マークをクリックします。

20150808_Map5

メニューをクリック

2. メニューが表示されるので”地図を共有または埋め込む”を選択。

地図を共有または埋め込む

地図を共有または埋め込む

3. 小さな画面が開くので上のタブで”地図を埋め込む”を選択៉します。

地図を埋め込むタブ

地図を埋め込むタブ

4. お好みの地図のサイズを選んで、右に表示されるコードを選択してコピーしておきます。

地図サイズを選択してコードをコピー

地図サイズを選択してコードをコピー

ブログの記事に張ってみよう

コードが取得できたのでサイドに実際にブログに貼ってみます。今回はWordpressの画面で説明しますが他のブログの場合でも同じようなことができると思うのでやってみてください。

1. ブログの編集画面で編集モードで”テキスト”を選びます。

テキストを選択

テキストを選択

2. 地図を挿入したい場所にさっきコピーしておいたコードをコピーします。

地図のコードを貼り付け

地図のコードを貼り付け

3. 再度編集モードを”ビジュアル”に戻して思った位置に地図が入っているか確認します。この時には地図は黒い四角で表示されていますが問題ありません。

地図の部分がグレー表示される

地図の部分がグレー表示される

4. 最後にプレビューで実際にどのように表示されるか確認してみます。実際にプレビューするとこんな感じになります。問題なければ投稿します。

プレビューはこんな感じ

プレビューはこんな感じ

実際に地図を貼ってみました。こんな感じになります。