[ウェブサービス系パーツ]Google Mapを貼り付ける
Google Mapを貼り付けて、場所の案内などに使うことができます。
[ウェブサービス系パーツ]のGoogle Mapには、「埋め込み型」「スタイル・マップ」の2種類があり、「スタイル・マップ」での設定には、APIキーの取得が必要となります。
APIキーの取得方法についてはこちらを参照してください。
また、Google Mapの埋め込みタグをカスタムタグパーツで設定して、Google Mapを表示させる事も可能です。
カスタムタグパーツでの設定方法についてはこちらを参照してください。
初期設定を行う
ブロックエディタ画面でウェブサービス系パーツ内の〈Googleマップ〉を選択します。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://support-info.jp/toppinghp/wp-content/uploads/sites/13/images/03030716m-01-1.png)
設定方法を選択する
Mapの設定方法を選択し、〈次へ〉をクリックします。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://bindup.jp/support/wp-content/images/03030716m-01-up.jpg)
スタイル・マップを選んだ場合のみ、〈テンプレートデザイン〉を選択し、〈次へ〉をクリックします。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://bindup.jp/support/wp-content/images/03030716m-02-01.jpg)
地図を編集する
地図の表示場所、表示倍率やサイズなどを設定します。地図上をドラッグすると、表示する場所を移動できます。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://bindup.jp/support/wp-content/images/03030716m-05-1.png)
〈検索〉
地図で表示する場所を検索します。
〈サイズ〉
地図の表示サイズを設定します。
〈地図〉/〈航空写真〉
地図と航空写真のどちらを表示するかを切り替えます。
ズーム
スライダをドラッグして地図の表示倍率を調整します。
json
別のブロックや、サイトで設定したGoogleマップデータのインポート、エクスポートができます。
カスタマイズしたデータをインポートすることで、様々なデザインのGoogleマップを簡単にコピーすることが可能です。
スタイルの編集
地図上に配置するテキストやアイコンなどのスタイルを編集できます。
地図の編集を確定する
地図のサイズなどが決まったら〈次へ〉をクリックします。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://bindup.jp/support/wp-content/images/03030716m-06-1.png)
(スタイル・マップ選択の場合)APIキーを入力する
APIキーを入力し、〈次へ〉をクリックします。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](http://support-info.jp/wp-content/uploads/images/03030716m-05-01.jpg)
設定を確認する
設定内容を確認し、〈適用〉をクリックします。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://bindup.jp/support/wp-content/images/03030716m-08-1.png)
ブロックエディタにGoogle Mapが貼り付けられますので、〈適用〉をクリックします。
![[ウェブサービス系パーツ]Google Mapを貼り付ける](https://support-info.jp/toppinghp/wp-content/uploads/sites/13/images/03030716m-05-01-1.png)
