ホームページ制作 大阪 | 目標を実現するweb制作会社、株式会社トレボ
TREVO(トレボ)

TREVOのスタッフブログ

Blog
2014.10.14.

新旧Googleマップ埋め込みコードの取得方法

01ホームページを制作すると、アクセス等のページにマップを入れることはよくあります。
そんな時によく利用するのがGoogleマップです。
以前は、ページ内にGoogleマップを埋め込むのに少し手間だったのですが、今では簡単に地図を埋め込むことができます。

埋め込み方法

02
Googleマップにアクセスして表示させたい住所を入力します。
表示された住所が表示されます。
03
右下に表示される歯車のボタンをクリックします。
04
「リンクを共有/地図を埋め込む」のボタンをクリックします。
画面が切り替わり「リンクを共有」と「地図を埋め込む」のどちらを選択できるので「地図を埋め込む」をクリックします。
05
地図のサイズを選びます。
サイズは「大」「中」「小」「カスタム」から選ぶことができます。
「カスタム」を選択すると地図の高さと横幅を入力することができ、好みのサイズに変更できます。
完成したコードをコピーしてホームページに張り付けるとホームページに上に地図が表示されます。

旧マップコードの取得方法

Googleマップは少しずづ改良されており、今回紹介した方法のひとつ前の地図では少し地図の表示の仕方が異なります。
また、新しい地図では検索した住所によっては位置を示すピンが表示しないことがあります。
そんな時に旧地図のコードを張り付けるとピンが表示することがります。
06
新しいGoogleマップにアクセスして表示させたい住所を入力します。
画像の右下にある「?」ボタンをクリックします。
07
「以前のマップに戻る」ボタンが表示されるのでクリックすします。
08
画面が切り替わり画面左側に地図の設定情報が表示されます。
その中から「リンク」マークをクリックします。
09
すると「ウェブサイトへの地図埋め込み用 HTML コード」が表紙されるので
コードをコピーしてホームページに張り付けると地図が表示されます。
必要に応じて使いけてください。

ホームページ制作 大阪 | 目標を実現するweb制作会社