ライムスです(*^^*)
今回は、Googleマップをスマホで見た際に、しっかりとスマホの枠におさまる方法をお伝えしたいと思います。
サイト運営をしている際に、Googleマップを活用する人は大勢おられると思いますが、スマホから見た時に、サイズがおかしくなっているサイトをよく見かけます。
また、サイズがおかしくなるため、Googleマップのサイズを『小』にしていまう人もいますが、画面が小さくと非常に見づらいですよね。
非常に簡単ですので、サクッとやっていきましょう!
Googleマップをスマホサイズに埋め込んでみよう
今回は、例として『アメリカ』を埋め込んでいきます。
①Googleマップを開き、調べたい場所を入力し、『共有』をクリック。
![](https://life-money-create.com/wp-content/uploads/2019/12/789fac070219b1c8b57f363dbd1a95a2.png)
②『地図を埋め込む』をクリック。
![](https://life-money-create.com/wp-content/uploads/2019/12/7fd97441bc1e928dfc4cb02be9b54264.png)
③HTMLをコピー
![](https://life-money-create.com/wp-content/uploads/2019/12/d1a778f9c8562fe21237179d98dc9089.png)
ワードプレスの『テキスト』でHTMLをはりつけます。
この時に、600となっている箇所(サイズ中の場合)を100%に書き換えます。
![](https://life-money-create.com/wp-content/uploads/2019/12/77cd03bfcf84679a2caeb16be1962aac.png)
書き換えた形がこちらです。
![](https://life-money-create.com/wp-content/uploads/2019/12/4bf62b1e21ffb88d5bbee7f444da33a3.png)
これで、スマホで見た際に横のサイズが合わさりはみでなくなります。
非常に簡単で有効的ですので、是非おためしあれ(^o^)