Emanon Businessには、フロントページに設置できるウィジェットが用意されています。当デモサイトでは、フロントページ[下部]にプラグインを使ったGoogle MPAを設置しています。

スポンサーリンク





ウィジェットの設定

WordPressの管理画面>外観>ウィジェットをクリックすると下記画面になります。

当デモサイトでは、プラグイン「Simple Map」のショートコードをテキストウィジェットに入力し、フロントページ[下部]に配置しています。なお、フロントページ[上部]は、ニュースティッカーセクションの直下に表示されます。

注意】Emanon Businessはトップページにセクション表示ができるため、Emanon Proのウィジェット配置と若干項目が異なります。具体的には、「トップエリア PC」「ボトムエリア PC」「トップエリアSP」「ボトムエリアSP」の4項目がEmanon Bussinessにはありません。

プラグイン「Simple Map」の設定方法

Simple Map」とは、サイト上にGoogle Mapを追加できるプラグイン(作成者:Takayuki Miyauchi様)です。

「Simple Map」をインストール&有効化すると、WordPressの管理画面>設定に、Simple Mapのメニューが表示されます。

「Simple Map」を利用するには、Google Maps APIキーが必要です。こちらのページから取得できます。Google Maps APIs for Web

Google Maps APIキーの取得方法

Googleにログインし、キーの取得ボタンをクリックします。

Maps Web APIの有効化が表示されます。Yesにチェクを入れ、CREATE AND ENABLE APIをクリックします。

最後に、YOUR API KEYをコピーし、WordPressの管理画面に戻り、Simple Mapの設定画面にAPIコードを貼り付けます。これでプラグインの設定は完了です。

Google MAPを表示するには、ショートコードを作成します。

</pre><p>作成したショートコードは、フロントページにテキストウィジェットで配置します。</p><img class="alignnone size-full wp-image-2997" src="https://wp-emanon.jp/emanon-business/wp-content/uploads/2017/05/google-map.png" alt="ショートコードの設置" width="720" height="720" srcset="https://wp-emanon.jp/emanon-business/wp-content/uploads/2017/05/google-map.png 720w, https://wp-emanon.jp/emanon-business/wp-content/uploads/2017/05/google-map-150x150.png 150w, https://wp-emanon.jp/emanon-business/wp-content/uploads/2017/05/google-map-300x300.png 300w, https://wp-emanon.jp/emanon-business/wp-content/uploads/2017/05/google-map-180x180.png 180w" sizes="(max-width: 720px) 100vw, 720px" /><p>このデモサイトの場合、ブレークポイントと高さを指定したショートコードをテキストウィジェットに入力し、配置しています。</p><pre class="lang:default decode:true ">東京都千代田区九段南1-5-6 りそな九段ビル