Googleマップの位置を変更する

html-change-google-map-1

通常、Googleマップは、お問い合わせページに設置されることが多いです。どのように表示させるかについて見ていきましょう。 まず初めに、テンプレートフォルダーを開き、htmlディレクトリに行きます。 index.html、index-1.htmlなど、複数のhtmlファイルか、単一のファイルを確認すると思います。 どちらの場合でも、HTMLファイルにはテンプレートページの内容(コンテンツ)が含まれています。

html-change-google-map-2

お使いのブラウザで任意のindexファイルを開き、お問い合わせボタンをクリックします。アドレスバーには、ページのファイル名が書かれています。 それをAdobe DreamweaverやnotepadなどのHTMLエディターを使って開きます。 スクロールするか、検索ツール(Ctrl+F)を使って、iframe タグを探します。 Googleマップは通常、次のコード構成でページに埋め込まれています。

<iframe src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Brooklyn,+New+York,+NY,+United+States&aq=0&sll=37.0625,-95.677068&sspn=61.282355,146.513672&ie=UTF8&hq=&hnear=Brooklyn,+Kings,+New+York&ll=40.649974,-73.950005&spn=0.01628,0.025663&z=14&iwloc=A&output=embed" height="210" width="312"></iframe>

ここで自分のサイトのマップを設置するために、下記のステップを進めて下さい:

  1. maps.google.comに行きます。
  2. マップの場所を検索し、適当な範囲でズームして下さい。
  3. 左側の検索結果を見て、右上にあるリンクアイコンをクリックし、ウェブサイトへの地図埋め込み用HTMLコードをコピーします。
  4. 自分のサイトにある問合せページに既に地図がある場合は、コードを取り替えます。
  5. width=”312″ height=”210″属性マップの大きさを編集します。(例:width=”312″ height=”210″)
  6. ファイルを保存し、ブラウザで表示を確認して下さい。

html-change-google-map-3

以上で、新しいGoogleマップが表示されている事を確認できます。


Comments are closed.