Q.APIキーを使わずにアクセスページを制作したいのですが、可能でしょうか?
当記事では、以下のような方に向けて対応案をご紹介しています。
・APIキーを使わずにアクセスぺージの「アクセスマップ」部分を制作したい
・アクセスぺージ内に複数のマップを入れたい
・CURE アクセスぺージ
・固定ページテンプレート「アクセス」機能紹介記事
・Google Maps Platform APIキーの解説記事
A.下記の方法でご対応ください。
- Google Mapsの埋め込みコードを取得します。→参考記事
- 「フリースペース」を追加して、テキストモードで以下のHTMLタグを挿入します。
<div class="ytube">❶で取得した埋め込みコード</div>
補足)
「アクセスマップ」のように見出しやアクセス情報を表示させたい場合、アクセスマップで出力されるHTMLタグを流用して再現していきます。以下を適宜書き換えて対応してみてください。
<div class="access_content2 access_content num0"> <h3 class="top_headline rich_font_type2">見出し</h3> <div class="ytube">❶で取得した埋め込みコード</div> <div class="info_area" style="background:#f5f5f5;"> <div class="address_area"> <div class="item access_info"> <div class="post_content clearfix"> <div class="tcd_access_info"> <h5><span style="color: #00a8ca"><strong>車でお越しの方</strong></span></h5> <p>阪神11号池田線 梅田 5分~10分<br> 阪神1号環状線 堂島 5分</p> <h5><span style="color: #00a8ca"><strong>バスでお越しの方</strong></span></h5> <p>JR大阪バス梅田バス停下車 徒歩15分<br> 阪急バス梅田バス停下車 徒歩5分</p> </div> </div> </div> <div class="item"> <div class="item_inner"> <div class="sub_item contact"> <h3 class="headline rich_font">診療予約はこちら</h3> <div class="link_button"> <a href="ボタンのリンク先URL">WEB予約</a> </div> </div> <div class="sub_item tel"> <h3 class="headline rich_font">電話予約はこちら</h3> <div class="number_area"> <p class="tel_number"><span class="icon"></span><span class="number">06-1234-5678</span></p> <p class="tel_desc">受付:8:00 - 19:00(日・祝休診)</p> </div> </div> </div> </div> </div><!-- /info_area --> </div> </div>
この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!