今回はみんな大好きGoogleマップをホームページに入れ込んでみました!
ホームページでよく見る、アクセスマップ。簡略化した地図を表示されているケースもありますが、Googleマップが表示されているケースも多いと思います。
それを今回は実装していきます!
まずは完成図から
↓

(Googleマップのデフォルトでは、目的地は赤のピンですが、スターに変更しています)
では、Googleマップを追加する方法を順を追って説明していきます。
実は、これ非常に簡単に実装できるんです!
完成図ではセクションを追加して、画面左は住所を載せて、右にGoogleマップを作成しました。
セクションの追加は別記事で紹介していますので、こちらをご覧ください。
1.パーツを追加

パーツを追加、フォーム、地図を選択して、
好みの色のマップをドラッグ&ドロップして、ホームページに追加します。

デフォルトでは、アメリカの住所が設定されています。
2.住所とタイトルを設定

地図を管理から、住所とタイトルと詳細を編集しました。
今回は国会議事堂の住所を設定しました。
3.その他の設定

Googleマップには様々な機能が入っています。
地図を航空写真に変更したり、ストリートビューを表示したり、ズーム機能などがあり、
その機能がデフォルトではONになっているので、OFFにすることができます。
4.ピンのデザインを変更する

デフォルトでは赤で黒丸があるピンですが、様々なデザインを選択できます。
今回は星にしました。
たった、これだけでGoogleマップを追加できます。