MEO対策「マップでアップ」、東京都主催の世界発信コンペティションで「特別賞」受賞！
おはようございます。360株式会社の伊藤です。
今回は、Googleマップをホームページやブログに埋め込む方法について解説いたします。
ホームページやブログにGoogleマップを埋め込むことで、
会社やお店までのアクセス方法が分かりやすくなります！
埋め込みはカンタンなので、HTMLの知識がちょっとあれば大丈夫です！
もくじ
Googleマップをホームページに埋め込むカンタンな方法
サンプルとして、「東京駅」を、このブログに埋め込んでみます。
（１）埋め込みたい場所を、Googleマップで表示します
まず、Googleマップで、ホームページやブログに埋め込みたい場所を表示しましょう！
ここでは、「東京駅」と入力しました。
（２）「共有」マークを押します
つぎに、共有マークをクリックします。
すると共有方法が選択できます。
今回は「地図を埋め込む」を選択しましょう。
（３）地図の大きさを調整します。
埋め込む地図の縦横サイズを決めましょう。
「小」「中」「大」「カスタムサイズ」の4種類から選択できます。
「小」…横400px 縦300px
「中」…横600px 縦450px
「大」…横800px 縦600px
「カスタムサイズ」…自由に数字を入力
なお、地図のズームレベルを調整したい場合は、
「CTRLキーを押しながらマウスホイール」で可能です。
（４）「埋め込みコード」をコピーします
埋め込みコードは、以下のようにとても長いです。
「HTMLをコピー」という個所を押すことで、埋め込みコードを丸ごとコピーできます。
<iframe src=”https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2162.9965192692625!2d139.7652839627025!3d35.68111511958082!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188bfbd89f700b%3A0x277c49ba34ed38!2z5p2x5Lqs6aeF!5e0!3m2!1sja!2sjp!4v1529927231570″ width=”600″ height=”450″ frameborder=”0″ style=”border:0″ allowfullscreen></iframe>
（５）「埋め込みコード」をペーストします
埋め込みたいホームページやブログのHTMLに「埋め込みコード」をペーストします。
すると、以下のように、Googleマップを埋め込むことができます。
以上の5ステップで、Googleマップの埋め込みは終わりです。
慣れればカンタンです！
まとめ
今回はGoogleマップをホームページやブログに埋め込む方法について解説いたしました。
Googleストリートビューを埋め込む方法については、下記記事にまとめていますので、
よろしければご覧ください！
Googleストリートビューをホームページやブログに埋め込む方法
Webマーケティングでしたら、360株式会社にお任せください！
Webサイト制作・SEO対策・MEO対策・SNS運用・動画制作・VR制作など
クライアントのビジネスに合わせた施策をご提案いたします。
