紙の地図は回して読むタイプの元栄養士のおもちです。
さて今回は、ブログにGoogleマップを埋め込む方法や複数のピン（住所）を一括表示させるマイマップの作り方などを紹介したいと思います。
こんな方におすすめの記事です！
・おすすめの場所やお店のマップをブログで紹介したい方
・自分の行った複数の場所をマップに一括表示させて紹介したい方
など。Googleマップを活用してより分かりやすいブログを目指して行きましょう♪
Googleマップをそのままブログに埋め込む方法は？
まずは基本操作として表示させたいマップをそのままブログに埋め込む手順や方法を紹介します。
１つの場所やお店に絞り、その周辺マップをブログに表示させたい場合などにおすすめです。
【マップをブログに埋め込む大まかな手順】
Googleマップを開く
↓
メニューを開く
↓
地図を共有又は埋め込むを選択
↓
地図を埋め込むのタブを開き、HTMLをコピーする
↓
ブログのカスタムHTML内に貼る
以下、画像を使って解説します。
①Googleマップに地図を表示させたら、検索バーにあるメニューをクリック
②メニュー内の地図を共有又は埋め込むをクリック
③
地図を埋め込むをクリック
↓
HTMLをコピーをクリック
④ブログ内のカスタムHTMLに貼り付けて完了
※プレビュー画面で確認しましょう。
複数のピン（住所）をブログで一括表示させるには？
表示させたいピン（住所）が複数ある場合、1つのマップに一括にまとめることが可能です。
例）戸越銀座商店街にあるおすすめのお店をブログで紹介したい場合↓↓↓
上の地図は、過去に当ブログで使用したマイマップの画像例です。
下記のリンク先の記事の最後にマップを一括表示させています♪
＞＞実際にマップを表示させている記事をチェック
※現在はナンバリングで表示しています。
【一括表示させる大まかな手順】
メニューを開く
↓
マイプレイスからマイマップを選択
↓
表示させたい住所を検索して地図に追加
↓
ピンのスタイルを決める（デザイン選択）
↓
共有設定（公開条件を決める）
↓
HTMLコピー＆貼り付け
以下、画像を使って解説します。
【表示させたい住所を複数選択する】
①検索バーにあるメニューをクリック
②マイプレイスをクリック
③
マイマップ
↓
地図を作成をクリック
④下の画像が表示されます。
・無題の地図
・無題のレイヤ
それぞれの名前は後から編集出来ます。
ここでは
無題の地図→戸越銀座商店街
無題のレイヤ→呑み歩き
としています。
⑤表示させたい地名や店名等を検索
⑥下にある「＋」マークをクリックして地図に追加する
⑦複数の場所を表示させるために、⑤と⑥を繰り返す。
ブログでマップを一括表示させるまであと少しです！
【ピンのデザイン選択や共有設定を行う】
①全て地図に追加したら、一番左のアイコンの「スタイル」をクリック
②ピンのデザインを決める
・色
・アイコンの種類
③表示させたい住所やデザインが決まったら、共有設定（公開範囲の選択）をします。
※共有設定をしないと埋め込むことが出来ません。
↓
下の画像にある共有をクリック
④このリンクを知っている人なら誰でも表示できるをクリック
⑤共有設定後、下の画像のタブを開く
↓
自分のサイトに埋め込むをクリック
⑥表示されたHTMLをコピーする
↓
ブログ内のカスタムHTMLに貼り付け
これで完了です。
記事を公開する前に、プレビュー画面でちゃんと表示されるか確認しましょう♪
ピン（住所）をナンバリングして一括表示させる方法
ピンの表示スタイルは様々な種類があります。
・均一スタイル
・続き番号
・個別スタイル
など。
ナンバリングさせるには、続き番号を選択します。
Googleマップでは様々な機能が沢山あります。
より快適に使う為に、一緒に少しずつ勉強していきましょう♪
あわせて読みたい＞＞呑み歩き！都内で一番長い戸越銀座商店街のお店をご紹介
最後までご覧いただき、ありがとうございました。
コメント