[外部サービス]Google Mapを貼り付ける(スタイル・マップ)

Google マップをサイトに埋め込むことで、店舗や会社の所在地などを地図で分かりやすく表示できます。

本ページでは、「スタイル・マップ」の設定方法をご案内します。
スタイル・マップはAPIキーを利用し、地図のデザインカスタマイズが可能です。

[外部サービス]のGoogle Mapには、「埋め込み型」「スタイル・マップ」の2種類があり、「スタイル・マップ」での設定には、APIキーの取得が必要となります。
APIキーの取得方法についてはこちらを参照してください。
また、Google Mapの埋め込みタグをカスタムタグパーツで設定して、Google Mapを表示させる事も可能です。
カスタムタグパーツでの設定方法についてはこちらを参照してください。

デザインカスタマイズが不要な場合は、APIキーの取得やクレジットカードの登録が不要な「埋め込み型」をご利用ください。

初期設定を行う

ブロックエディタ画面で外部サービス内の〈Googleマップ〉を選択します。
〈Googleマップ〉を選択

設定方法を選択する

Mapの設定方法を選択し、〈次へ〉をクリックします。Google Map 埋め込み型を選択

〈テンプレートデザイン〉を選択し、〈次へ〉をクリックします。

地図を編集する

地図の表示場所、表示倍率やサイズなどを設定します。地図上をドラッグすると、表示する場所を移動できます。

〈検索〉

地図で表示する場所を検索します。

〈サイズ〉

地図の表示サイズを設定します。

〈地図〉/〈航空写真〉

地図と航空写真のどちらを表示するかを切り替えます。

ズーム

スライダをドラッグして地図の表示倍率を調整します。

json

別のブロックや、サイトで設定したGoogleマップデータのインポート、エクスポートができます。
カスタマイズしたデータをインポートすることで、様々なデザインのGoogleマップを簡単にコピーすることが可能です。

スタイルの編集

地図上に配置するテキストやアイコンなどのスタイルを編集できます。

地図の編集を確定する

地図のサイズなどが決まったら〈次へ〉をクリックします。

(スタイル・マップ選択の場合)APIキーを入力する

APIキーを入力し、〈次へ〉をクリックします。

設定を確認する

設定内容を確認し、〈適用〉をクリックします。

ブロックエディタにGoogle Mapが貼り付けられますので、〈適用〉をクリックします。