WordPress で書いている記事に Google Map の地図を埋め込むのは、Google が用意している埋め込み用の URL を張り付けるだけで簡単です！
実際に地図を埋め込む方法を紹介します。
目次
Google Map の埋め込み例
「凱旋門」の地図を埋め込んでみます。
パリの地図を見ると楽しくなりすぎて、もろもろ止まらなくなるので危険ですね。
Google Map を埋め込む方法
プラグインを使う方法もありますが、あまりプラグイン漬けになっても、WordPress が「わけわかめ」になりますので、直接貼る方法です。
（直接貼る方法が圧倒的に簡単です）
■ Step.1 Google Map で埋め込みたいページを表示する
左上の小窓に「住所」、または、「ランドマーク」、または「店名」などを入力して虫眼鏡で検索して目的の場所を見つけます。
■ Step.2 埋め込みコードを取得する
画面左上のメニュー（横三本線のアイコン）をクリックします。メニューが現れますので「地図を共有または埋め込む」をクリックします。
「地図を埋め込む」 をクリックします。
左上のプルダウンでサイズを選び、「HTMLをコピー」 表記をクリックします。
これで、クリップボードに、埋め込み用のコードをコピーします。
■ Step.3 WordPress の任意の場所に貼り付ける
ブロックを 「カスタム HTML」 で指定し、先ほどの 貼り付け用コード を貼り付けて完成です！
枠線（ボーダー）をつける方法
そのまま URL を張り付けた場合は、地図の周りに枠線（ボーダー）が表示されません。
ボーダーを表示したい場合は、HTML の style="border:0;" を style="border:1px solid;" に書き換えます。
■ 枠線を付ける場合の書き換え例
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d5248.3655650304645!2d2.295027!3d48.873792!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xd9b5676e112e643d!2z44Ko44OI44Ov44O844Or5Yex5peL6ZaA!5e0!3m2!1sja!2sjp!4v1626103657709!5m2!1sja!2sjp" width="800" height="600" style="border:1px solid;" allowfullscreen="" loading="lazy"></iframe>
一か所書き換えるだけで枠線を付けることができて簡単です。
まとめ
Google Map の地図をサイトに埋め込む方法です。
- Google Map から HTML を取得する
- HTML をサイトに埋め込む
めっちゃ簡単ですね。
Enjoy！「あんなとこへの行き」方や、「こんなとこへの行き方」をバンバン紹介できますね！
WordPress のおすすめテーマ
- SEO に強く【集客力強化】が望める
- かっこいい（かわいい）ホームページを作りやすい
- 初心者でも使えて、上級者になっても満足できる
本気でブログアフィリエイトを戦うなら、使うテーマは「AFFINGER」！
WordPress ブログの最上級おすすめテーマ「AFFINGER」をお試しください。
-
-
AFFINGER（アフィンガー）テーマは「ここ」がすごい！【WordPress 初心者必見！】
AFFINGER テーマを使うと「オシャレなサイト」を作りやすくなります。オシャレなサイトは、ユーザーの滞在時間が増え、サイト評価があがり、サイトの露出が増えて、さらにユーザ（読者）を呼び込む好循環を実現します。WordPressのテーマ「AFFINGER」を徹底紹介します。
続きを見る
WordPress の情報、テクニック一覧はこちらをクリック！
