Google Mapはどのサイトでも会社説明やアクセスページなどで基本的によく見るパーツですよね。
Wixでも埋め込むことができますが、サイト編集の項目が多すぎて初見だとおそらく見つけるのは難しいです。

そこで今回はWixでGoogle Mapを埋め込む方法を解説します！

Google Mapの追加

まずはサイトにGoogle Mapの追加をしていきます。

サイト編集　→　画面左にあるツールバー　→　「＋」の追加ボタン　→　フォーム　→　地図　の中からお好みのデザインを選択。
※個人的には普段から見慣れているGoogle Mapのデザインに近い「クラシック(高速道路)」・「クラシック(地形)」がおすすめです！

これでサイトにGoogle Mapの追加が完了です！

Google Mapの編集

デフォルトでは住所がWixの本社になっているので、変更する必要があります。

Google Mapのピン位置を変更

Google Mapのパーツをクリックし、「地図を管理」を選択。

編集項目がでるので「住所」の項目をGoogle Mapに表示したい住所に変更し、「タイトル」も変更します。

上記を変更するとGoogle Mapの表示が変わったことが確認できます。

Google Mapの幅を変更

Google Mapをサイトの横幅いっぱいに見せたい場合もあるかと思います。
設定方法はごく簡単で、Google Mapのパーツをクリックし、「ストレッチ」を選択。
「全幅に引き延ばす」にチェックを入れる。

そうすると画面の横幅いっぱいにGoogle Mapの地図が広がります。
あとはお好みでパーツをドラッグし、高さを調整してください。

いらない表示項目の削除

デフォルトでGoogle Mapに表示されている各項目を少し解説します。
こちらを参考にいらない項目を削除してください。削除の設定は後ほど解説しています。

地図/衛星写真

地図の表示の仕方を変更できます。

ズームイン/ズームアウト

地図の拡大、縮小を操作できます。

ストリートビュー

地図のストリートビューを表示できます。

ルート案内リンクを表示

目的地までの案内が表示されます。

マップのドラッグ

地図を画面いっぱいに表示します。

各項目の挙動は以上になります。

ここまで解説した各項目の編集は「設定」→「Google マップ設定」からチェックを外すことで非表示に変更できるのでお好みで設定してみてください。

まとめ

今回はWixでGoogle Mapを埋め込む方法を解説しました。
ここまで記事を読むことでGoogle Mapの追加から編集、細かな設定までを覚えることができたと思いますので、ぜひサイトに埋め込みをしてみて下さい！

Pickup記事

請求書作成サイト「MISOCA」の使い方【フリーランス初心者必見！】 フリーランスは一般の会社員とは違い、自分でやらなければいけない手続きが多いです。特にその一つが請求書の作成かと思います。請求書作成のオンラインサイトは「MISOC…

Pickup記事

初心者向けガイド！ChatWork（チャットワーク）の使い方 【基本的な機能をまるっと解説】 ビジネスシーンで多く利用されるChatWork（チャットワーク）ですが、全く使用したことがないと、何から始めて・どんな操作・どんな使い方をすれば良いかの判断が出来ま…

投稿 WixでGoogle Mapを埋め込む方法！【たったの3分でWebサイトでよく見る地図を作成】 は なまはげブログ に最初に表示されました。