サポート » プラグイン » Advanced Custom Fieldsでgoogleマップ表示

  • 解決済 shinichi_ntrue

    (@shinichi_ntrue)


    Advanced Custom Fieldsのカスタムフィールドで
    フィールドグループをつくり、
    ルールは投稿タイプで
    レイアウトにGoogleMapを作りました。
    フィールド名はcontent_mapでつくりました。

    この後からがわからないのですが、下記を参考にという記事が多かったので確認しました。
    https://www.advancedcustomfields.com/resources/google-map/
    ・Required CSS & JS
    ・Render a single maker onto a map
    ・Render multiple markers onto a map
    上記の3つはどのファイルのどこに追記するのかがわかりませんでした。

    よろしくお願いします。

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • ACFのドキュメントベースで回答します。
    ドキュメントに書いてある通りなんですけど…

    Required CSS & JS
    CSSは以下のような方法でヘッダー追記します(他にもあるかもしれません)

    • <style type="text/css"></style>を含めたスタイルを追記する
    • <style type="text/css"></style>の中身を記述したCSSファイルを作成して設置する
    • <style type="text/css"></style>の中身を既存のCSSファイルに追記する

    JavaScriptは以下のような方法でヘッダーまたはフッターに追記します(他にもあるかもしれません)

    • <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
      <script type="text/javascript"></script>を含めたスクリプトを追記する
    • <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
      <script type="text/javascript"></script>の中身を記述したJSファイルを作成して設置する
    • <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
      <script type="text/javascript"></script>の中身を既存のJSファイルに追記する

    Render a single maker onto a map
    マップのピンをひとつだけ表示する(指定する地名・住所・緯度経度をひとつだけ指定する)場合、表示するテンプレートファイルの表示したい箇所に記述されているコードを設置してください。
    その際にはget_field('location');の「location」部分を自身で指定したフィールドのキーに置き換えてください。

    Render multiple markers onto a map
    マップを複数表示する(指定する地名・住所・緯度経度を複数指定する)場合、表示するテンプレートファイルの表示したい箇所に記述されているコードを設置してください。
    その際にはhave_rows('location');get_sub_field('location');の「location」部分を自身で指定したフィールドのキーに置き換えてください。
    これを実装する際にはrepeater機能を使用しているかと思いますので、他にフィールドがあればthe_sub_field('title');のように別途指定したフィールドのキーを入れてください。

    トピック投稿者 shinichi_ntrue

    (@shinichi_ntrue)

    >Takenori Okashita さん
    回答ありがとうございます。
    書かれていたとおりにやったつもりですが、うまくいきませんでした。
    もう少し調べてやってみます。

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • トピック「Advanced Custom Fieldsでgoogleマップ表示」には新たに返信することはできません。