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

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

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

スタイル・マップの利用にはAPIキーが必要です。
Googleより毎月200ドル分の無料枠（クレジット）が提供されるため、一般的なアクセス数のサイトであれば毎月約28,000回まで無料で地図を表示できます。

APIキーの取得方法については「Google APIキーを取得する」をご確認ください。
※無料の上限数は変更となる可能性がございます。詳細はGoogle側のサポートをご参照ください。

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

Google マップを選択

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

マップタイプを選択する

Mapの設定方法を選択し、〈次へ〉をクリックします。

スタイル・マップを選んだ場合のみ、〈テンプレートデザイン〉を選択し、〈次へ〉をクリックします。

地図を編集する

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

〈検索〉

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

〈サイズ〉

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

〈地図〉／〈航空写真〉

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

ズーム

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

json

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

スタイルの編集

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

地図の編集を確定する

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

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

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

設定を確認する

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

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