「Gutenberg Map Block for Google Maps」プラグインは、WordPressのブロックエディターを使いGoogleマップをブログ（サイト）に表示させることができます。
通常、Googleマップをサイトで表示するには、ブラウザで別ページを開いてGoogleマップの「埋め込みコード」をコピーをして、それを投稿（または固定ページ）に埋め込む作業が必要になります。
しかし、このプラグインの最大の特徴は、別のページを開かずにWordPressのブロックエディターだけでGoogleマップをブログに表示することができるんです。
また、地図設定も、住所または郵便番号を入力するだけで地図を表示してくれます。
※プラグインの機能を使用するのに、Google API Keyを使用しています。API Keyは、デフォルトで設定されています。しかし、自身のサイトを公開する場合、 Google API Console でAPI Keyを取得して使用したほうが良いとおもいます。
プラグインのインストール・設定
「Gutenberg Map Block for Google Maps」プラグインを利用するには、管理画面のサイドバーにある「プラグイン」⇒「新規追加」を開いて検索すると表示されます。
プラグインをインストールをして有効化すると、特に設定することなく投稿エディタの中で使用できます。
プラグイン詳細：Gutenberg Map Block for Google Maps
プラグインの使用方法
ブロックエディターに「Map」が追加されているので、Googleマップを表示したいところ「Map」ブロックをクリックして追加します。
GoogleMapにアメリカのニューヨークの地図が表示されます。
Googleマップが表示されている「Map」ブロックをクリックしてフォーカスさせると、サイドバーの「ブロック」で地図設定することができます。
設定は、以下のようになっていています。
- Address：住所
- Zoom：場所の拡大と縮小
- Height：地図の高さの設定
- API Key：Google API Key
住所は、基本設定で「Theater District, New York, USA」になっています。
例としてAddressに「東京スカイツリー」、Zoomを「16」にします。
表示されるGoogleマップは、下のようになります。
コメント