【2023年最新】Googleマイマップをサイトに埋め込む方法

2023年6月28日

旅行やドライブに欠かせないGoogleマップですが、あまり知られていない機能に「Googleマイマップ」があります。

今回は「Googleマイマップ」の利用者向けに使い方と、サイト制作者向けにサイトに埋め込む方法をご紹介していきますので、知りたい方の記事をご覧ください。

もし、記事の内容がよくわからない〜わかるけど自分でやるのが面倒だ〜というあなたには、有料で私がマンツーマンでご説明しますのでぜひご相談ください^^

Googleマイマップとは?

Googleマイマップは、一言で言えば、「自分だけの地図を作れるツール」です。

普通の地図は、世界中の街や建物、道路などがすべて書かれていますよね。
それはとても便利ですが、自分が特に興味がある場所や、特別な場所だけを見たいときには、ちょっと見づらいかもしれません。

そんなときに便利なのが、Googleマイマップです。
Googleマイマップを使うと、自分だけの特別な地図を作ることができます。

たとえば、「お気に入りの公園の地図」や「行きたいお店の地図」、「夏休みの旅行計画の地図」など、自分の思い通りに地図をカスタマイズすることができます。

それだけでなく、自分が作った地図は、友だちや家族とも簡単に共有することができます。だから、「みんなでピクニックに行く公園を決めよう!」というときにも、とても便利です。

ビジネスでの活用

Googleマイマップは、ビジネスにおいても大変役立つツールであり、地図上に情報を視覚化し、共有することで多くの利点があります。

店舗の場所を示す

Googleマイマップは、特に物理的な店舗を持つビジネスにとっては絶大な助けとなります。

一般的なGoogleマップよりも詳細な情報を提供できるため、自社の店舗の位置を具体的に示すことができます。

駐車場の情報や近隣のランドマークなど、顧客が迷わずに店舗に到達できるような情報を付け加えることが可能です。

営業エリアの明示

営業エリアが限定される業種、例えば配送サービスや出張サービスを提供するビジネスにとって、Googleマイマップは営業エリアを明示するのに役立ちます。

エリアを色分けして視覚化することで、顧客は自分がサービスの対象エリア内にいるのか瞬時に理解することができます。

データの視覚化

特定の地理的データを持つビジネスでは、Googleマイマップを使ってそのデータを視覚化することができます。

例えば、不動産会社は物件の位置情報を表示したり、マーケティングチームは地域別の販売データをマッピングしたりすることが可能です。

これにより、データの傾向やパターンを一目で理解できるようになります。

イベント計画

会議やイベントを計画する際にも、Googleマイマップは便利なツールとなります。

イベントの会場や周辺のホテル、レストランなどの情報をマップ上に配置することで、参加者に必要な情報を一元的に提供することができます。

マイマップの作成方法

そんな便利なマイマップですが、作成の仕方が少し分かりづらいのが難点です。

方法を解説しているサイトもありますが、UIの変更があったのか、実際の設定画面と異なっていましたので、自分で手順を作成することにしました。

2023年6月27日時点の操作方法となります。

1.Googleマップを表示します。

2.画面左の[保存済み]をクリックします。

保存済みメニュー

3.「マイマップ」をクリックします。

マイマップメニュー

4.「マイマップを開きます」をクリックします。

マイマップを開きますメニュー

5.マイマップの管理画面が新しいタブで開きますので、[新しい地図を作成]をクリックします。

新しい地図を作成ボタン

すると、通常のGoogleマップの画面に以下のような画面が表示されます。

レイヤ設定画面

レイヤとは?

レイヤとは「層」や「階層」を意味する言葉です。

Googleマイマップにおいては、ポイントを分類するためのカテゴリのようなものだと思ってもらえば大丈夫です。

つまり、自分のお気に入りの場所をマイマップに登録するときには、飲食店でまとめたり、レジャー施設でまとめたりした方が見やすいし管理しやすくなりますよね。

そこで、レイヤを複数作成して、それぞれ該当するポイントをレイヤに保存していくわけです。

レイヤの名前を変更する

「無題のレイヤ」のままでは何の分類かわかりませんので、自分でわかりやすい名前に変更してあげます。

レイヤ右の[︙]をクリックして、「このレイヤの名前の変更」をクリックします。

レイヤ名変更メニュー
  • 「無題の地図」の右側の[︙]をクリックすると、地図自体の名前を変えることもできます

「レイヤ名を編集」画面が表示されますので、名前を変更して[保存]をクリックします。

レイヤ名変更画面

場所を追加する

レイヤ名を変更したら、その分類に該当するポイントを保存していきます。

通常のGoogleマップ同様にマップを拡大したり、検索ボックスから住所や名前で検索して、ポイントを選択したら、「+地図に追加」をクリックします。

地図に追加メニュー

同じ要領で行きたいところをどんどん追加していくと数のように地図のポイントがレイヤに追加されていき、マップ上にもピンが立つようになります。

新たなレイヤを追加する

新たなレイヤを追加して「行きたいところ」とは別の分類を作成してみます。

「レイヤを追加」をクリックします。

レイヤを追加メニュー

東京駅周辺のホテルを追加するためレイヤ名を「ホテル」としました。

新しく追加したレイヤ

レイヤを色分けする

「行きたいところ」と「ホテル」は分類が異なるため、ピンの色が同じだと分かりづらくなります。

そのため、ピンの色を変えてあげると非常に見やすくなるのでお勧めです。

ここではホテルの色を赤色に変えてみます。

1.「個別スタイル」をクリックします。

個別スタイルメニュー

2.「場所のグループ化方法」を「個別スタイル」から『均一スタイル』に変更します。

3.「すべてのアイテム」右にあるペンキ缶アイコンをクリックします。

ペンキ缶アイコン

4.カラーパレットが表示されますので、好きな色をクリックします。

色変更
  • [他のアイコン]をクリックすると、アイコンを変更することもできます。

すると下図のようにレイヤ「ホテル」のポイントは赤色に変わり、「行きたいところ」と色が区分けされて非常に見やすくなりました

色変更後のちず

サイトにマイマップを埋め込む

冒頭でもご説明したようにマイマップはプライベートな使い方以外にも、ビジネスで店舗の位置情報や、イベント時の会場や駐車場の位置を知らせることにも利用できます。

しかし、マイマップを作ったとしてもそれが公開されていないと他の人は見ることができません。

ここでは埋め込み用のコードを取得して、サイトに埋め込むまでを解説します。

1.埋め込むためには地図を共有する必要がありますので、「共有」をクリックします。

共有メニュー

2.「共有する前に名前と説明を追加」画面が表示されますので、地図タイトルや説明を入力し、[OK]をクリックします。
※設定しなくても埋め込みはできます。

名前と説明を追加画面

3.「地図の共有」画面が表示されますので、希望する共有方法をONにします。

地図の共有

【このリンクを知っている人なら誰でも表示できる】
リンクを知っている人だけに公開する場合はONにします。
サイトに埋め込みをする場合は最低限こちらの設定をONにします。

【インターネットで検索しているユーザーにこの地図を公開する】
検索した人にも広く公開したいという場合はONにします。

【この地図で自分の名前と写真を公開する】
Googleアカウントに設定している名前と写真を公開する場合はONにします。
ビジネスアカウントでない場合はOFFの方が良いと思います。

【ドライブで共有】
特定の人とだけ共有する場合はクリックします。
その後の設定画面でGmailアドレスなどを使って共有設定を行います。

これで共有設定は可能です。
引き続き、サイトに埋め込むためのコードを取得します。

4.地図のタイトル右の[︙]をクリックします。

地図名右の三点リーダー

5.「自分のサイトに埋め込む」をクリックします。

自分のサイトに埋め込むメニュー

6.「この地図を埋め込む」画面が表示されますので、コードをコピーします。

この地図を埋め込む画面

あとはコピーしたコードを自分のサイトに貼り付けてください。

例)WordPressの場合

サイトがWordPressで作成されている場合は、ブロックエディタから「カスタムHTML」を使用してコードを埋め込みます。

ブロック追加画面から「カスタムHTML」をクリックします。

カスタムHTML

コードの貼り付け画面が表示されますので、コピーしたコードを貼り付けます

貼り付け画面
  • コード内の「width」(幅)と「height」(高さ)の数値を変えると貼り付けたマイマップの大きさを変更することができます。

以下は実際に埋め込んだ結果です。

左上のタブレットのようなアイコンをクリックすると、レイヤやポイントの一覧が表示されます。

もし、記事を読んでいて「見ながら作業をする時間がもったいない!と感じた方は、ぜひご相談ください。

そんなあなたの作業時間を短縮するために「オンラインITサポート」を行っております。

自分で調べながらやったら1時間かかったことがサポートに聞いたら10分で終わったなんてことはよくあることです。

まずはお気軽に相談ください^^

詳しくは以下のバナーをクリック!

経営者のためのITサポートのバナー

未分類

Posted by hiro