HTMLとCSS

7回目 「Google Mapの埋め込み方」

地図も埋め込んでみたい

「HPで会場の場所を知らせないといけない…。でも文字だけでみんなわかってくれるだろうか…?」
となった時、地図がそのままHPにあるとこちらとしてもわかりやすいし、見る側もありがたいですよね。
と、言うわけで…

前回の「YouTubeの埋め込み」に引き続き、今度は地図を埋め込んでみたいと思います!
埋め込みシリーズです。

普通に埋め込んで見る

地図はGoogle Mapを活用します。
実は地図の埋め込み、前回の動画の埋め込み方と非常によく似ています。
それでは手順を説明します。

1…Google Mapを開く

2…住所を検索する。

3…検索結果が出たら表示欄に「共有」と出るのでそこをクリック

4…地図を埋め込むをクリックすると<iframe~から始まるHTMLコードが出てくる。

5…HTMLをコピーをクリックしてサイトテキストに貼り付ける。

これだけで埋め込み完了です。
私は東京駅の地図を埋め込んでみました。
またHTMLコードもYouTubeのコードと同じところがいくつかあります。
拙い内容ではありますが6回目の記事も参考にしてみて下さい。

今回は短めですがここまでとなります。
ご覧頂き、有難う御座いました。


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


上の計算式の答えを入力してください

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)