AMP ランディング ページの Google 広告のコンバージョン測定を設定する

このガイドでは、AMP のランディング ページでコンバージョンの測定を正しく行うために必要な設定と設定について説明します。

Google 広告に AMP を導入する方法について詳しくは、Google 広告のランディング ページで AMP を使用するをご覧ください。このガイドは、Google 広告に AMP を導入する手順を示したものです。

Google アナリティクスをご利用の場合は、AMP 向けに Google アナリティクス セッション統合を設定するの手順に沿って、AMP キャッシュ ページとサイトの残りの部分でユーザー セッションが正しく合成されるようにしてください。Google アナリティクスの目標やコンバージョンのエクスポート機能を使用している場合や、Google 広告を Google アナリティクスにリンクする場合は、Google アナリティクスを設定することをおすすめします。

背景

コンバージョンを正確に測定するため、広告のクリックにより GCLID(Google クリック ID)がランディング ページに渡されます。GCLID はランディング ページでドメインの Cookie に保存され、GCLID パラメータがサイトのコンバージョン タグに追加されます。詳しくは、Google 広告のウェブサイト コンバージョンをトラッキングする方法をご覧ください。

通常、AMP のランディング ページは AMP キャッシュ ドメインから配信されるため、GCLID を自社ドメインの Cookie に保存することはできません。AMP のランディング ページにタグを設定し、URL のクエリ パラメータを使って、サイト ページへの送信リンクに GCLID を渡す必要があります。これにより、サイトのページに設置したタグが、クエリ パラメータから GCLID を取得し、GCLID を Cookie としてドメインに保存できるようになります。

前提条件

すべてのブラウザでウェブサイトのコンバージョンを測定するには、Google 広告の自動タグ設定を有効にしてください。

基本構成

ステップ 1: AMP ランディング ページにタグを設定する

amp-analytics コンポーネントを使用するには、まず、必要なスクリプトを AMP ページのヘッダーに含めます。その後、Google タグまたは Google タグ マネージャーを使って、amp-analytics を使って Google 広告タグを設定できます。

方法 1: Google タグ

AMP 版のランディング ページでデフォルトの AMP 用の Google タグにコンバージョン ID を追加すると、ウェブサイトを訪れたユーザーが「すべての訪問者」リマーケティング リストに追加されます(リマーケティングを設定している場合)。

また、AMP キャッシュから正規ドメインのページに GCLID コンバージョン ID をデフォルトで渡せるようになります(つまり、AMP のランディング ページがサイトページへの送信リンクと同じドメインまたはサブドメインでホストされている場合、デフォルトでコンバージョンをリンクします)。以下のサンプルコード スニペットでは、独自の ads conversion id を使用します。

<amp-analytics type="gtag" data-credentials="include">
<script type="application/json">
{
  "vars" : {
    "gtag_id": "ads conversion id",
    "config" : {
      "ads conversion id": { "groups": "default" }
    }
  }
}
</script>
</amp-analytics>

gtag_id には、任意の Google サービス(例:Google 広告または検索広告 360 など)に商品を登録する必要がありますが、商品 ID は 1 つのみにしてください。

方法 2: Google タグ マネージャーを使用

ステップ 2: AMP 以外のページのタグ

非 AMP ページで必要なタグについて、以下の方法をご確認ください。以下の各オプションの詳細については、Google 広告のウェブサイト コンバージョンをトラッキングする方法をご覧ください。

方法 1: Google タグ

こちらで説明されているとおり:

  • Google タグスニペットをウェブサイトのすべてのページに配置します。
  • コンバージョン ページでは、イベント スニペットを使用します。このスニペットは Google タグスニペットよりも後であればどこに配置してもかまいません。

方法 2: Google タグ マネージャーを使用

Google タグ マネージャーのウェブコンテナで、次の作業を行います。

  • Google タグ マネージャーの Google 広告コンバージョン タグを作成します。
  • Google タグ マネージャーのウェブコンテナでコンバージョン リンカー タグを有効にする。

サイトのページ上のタグ マネージャー コード スニペットが iframe に読み込まれる場合は、コンバージョン リンカー タグで [ドメイン間でリンク] の設定を行い、[受信リンカー パラメータを受け入れる] を有効にします。

詳細設定: ドメイン全体のコンバージョン測定を設定する

AMP ページが標準以外のサブドメイン(www.m.amp. 以外)にある場合や、AMP ページが別のトップレベル ドメインのページにリンクしている場合は、コンバージョン測定が正しく機能するように追加の設定が必要になります。

ステップ 1: AMP ランディング ページにタグを設定する

Google 広告タグは、Google タグまたは Google タグ マネージャーを使って設定できます。

方法 1: Google タグ

  • AMP ページに AMP 用の Google タグを実装します。
  • 以下に、AMP ページのコード スニペットを追加します。
    • ads conversion id は、実際の Google 広告コンバージョン ID に置き換えてください。
    • domains を使って、AMP ページがホストされているドメインと、リンク先ドメインまたはサブドメインを追加します。
<amp-analytics type="gtag" data-credentials="include">
<script type="application/json">
{
"vars" : {
    "gtag_id": "ads conversion id",
    "linker": { "domains": ["subdomain1.example.com", "subdomain2.example.com","www.example2.com"] },
    "config" : {
      "ads conversion id": { "groups": "default" }
    }
  }
}
</script>
</amp-analytics>

gtag_id には、任意の Google サービス(例:Google 広告または検索広告 360 など)に商品を登録する必要がありますが、商品 ID は 1 つのみにしてください。

方法 2: Google タグ マネージャーを使用

  • Google タグ マネージャーの AMP コンテナを作成し、AMP 準拠のタグをデプロイします。
  • AMP コンテナにコンバージョン リンカー タグを追加します。
  • AMP ページがホストされているドメインと、送信リンクのドメインがある場合は、カンマ区切りのリストで追加します。

  • 以下の Google タグ マネージャーのデフォルトの AMP コード スニペットを AMP ページに追加します。

    <!-- Google Tag Manager -->
    <amp-analytics config="https://www.googletagmanager.com/amp.json?id=
      <GTM_CONTAINER_ID>&gtm.url=SOURCE_URL" data-credentials="include">
    </amp-analytics>
    

ステップ 2: 非 AMP ページにタグを設定する

非 AMP ページには、gtag.js、Google タグ マネージャー、analytics.js のいずれかを使ってタグを設定できます。

方法 1: Google タグ

  • 非 AMP ページに以下のコード スニペットを追加します。

    • ads conversion id は、実際の Google 広告コンバージョン ID に置き換えてください。
    • domains を使って、AMP ページがホストされているドメインと、リンク先ドメインまたはサブドメインを追加します。
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', '<var>ads conversion id</var>', {
        'linker': {
          'domains': ['subdomain1.example.com','subdomains2.example.com','www.example2.com']
        }
      });
    </script>
    

方法 2: Google タグ マネージャーを使用

方法 3: analytics.js

非 AMP ページでは、デフォルトの analytics.js コード スニペットを使用して、AMP リンカー パラメータを読み取ることができます。

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'GA_MEASUREMENT_ID', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

AMP ページがサイトへの送信リンクと異なるトップレベル ドメインでホストされている場合、またはよく知られているサブドメイン(www.amp.m. 以外)に AMP ページがある場合は、必要に応じて、以下のハイライト表示されている設定を追加します(analytics.js のクロスドメイン設定を参照)。

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'GA_MEAUSREMENT_ID', 'auto', {'allowLinker': true});
ga('require', 'linker');
ga('linker:autoLink', ['subdomain1.example.com', 'subdomains2.example.com', 'www.example2.com'] );
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

オプションの構成

このセクションでは、AMP の導入時に必要となる追加オプションの設定について説明します。

AMP ページのコンバージョン イベント

ほとんどの場合、コンバージョンはユーザー ジャーニーの後続のページ(非 AMP ページ)で発生します。その場合は、Google 広告のウェブサイト コンバージョンをトラッキングする方法の手順に沿ってください。

このセクションでは、AMP のランディング ページ自体のコンバージョンを測定するケースについて見ていきます。

Google タグを使用する

コンバージョンを記録するページで、Google 広告イベント スニペットを trigger オブジェクトに貼り付けます。以下に、Google 広告コンバージョンをレポートするために AMP コンバージョン ページ内に配置する必要があるタグの例を示します。

<!-- Google tag (gtag) -->
  <amp-analytics type="gtag" data-credentials="include">
    <script type="application/json">
    {
      "vars": {
        "gtag_id": "ads conversion id",
        "config": {
          "ads conversion id": {
           "groups": "default"
          }
        }
      },
      "triggers": {
        "ads conversion label": {
          "on": "visible",
          "vars": {
            "event_name": "purchase",
            "transaction_id": "",
            "value": 15,
            "currency": "USD",
            "send_to": "ads conversion id/ads conversion label"
          }
        }
      }
    }
    </script>
  </amp-analytics>

この <amp-analytics> タグの次のフィールドに注目してください。

  • gtag_id フィールドには、Google 広告コンバージョンによって提供される ID を指定します。
  • AMP で使用している任意の Google サービスの ID を指定できますが、gtag_id フィールドに使用できる ID は 1 つの Google サービスの ID のみです。
  • config オブジェクトには、AMP サイトでのアクティビティの測定に使用する Google サービスごとに 1 つのフィールドを含める必要があります。
  • Google 広告と検索広告 360 を両方ご利用の場合は、こちらの記事で手順をご確認ください。
  • この例では、amp-analytics コンポーネントは「ページの表示」イベントでトリガーされています。または、ボタンのクリックなど、別のイベントでコンバージョンが発動するよう設定することもできます。

Google タグ マネージャーを使用する

Google タグ マネージャーの AMP コンテナで、必要に応じてコンバージョン タグまたはリマーケティング タグを追加します。

AMP ページでは通話トラッキングがサポートされているため、Google 広告の通話コンバージョン トラッキングを有効にすることができます。なお、現在 Safari ブラウザはこの機能をサポートしていません。

ステップ 1: コンバージョン設定を見つける

まずは、Google 広告アカウントで電話番号表示オプションを設定する際のガイダンスをご覧ください。通話コンバージョンを作成したら、生成されたコードから、AMP タグで使用する設定パラメータを抽出しておく必要があります。これを行うには、Google 広告リニューアル版の Google タグ マネージャー設定または従来版の通話トラッキング スニペットを使用します。

方法 1: Google 広告の管理画面を使用する

Google タグ マネージャーのコンバージョン フィールドを使用するには、Google 広告アカウントにログインして、測定のコンバージョン アカウント設定に移動します。続いて、次の手順を実行します。

  1. [+] をクリックして新しいコンバージョン トラッカーを追加し、[電話件数] オプションを選択します。
  2. ダイアログで [モバイルサイトに掲載した電話番号のクリック] を選択し、[続行] を選択します。
  3. すべての関連フィールドを含むコンバージョンを設定してから、タグを作成します。
  4. [Google タグ マネージャーを使用する] を選択して、設定を確認します。
  5. 提供されたコンバージョン ID とコンバージョン ラベルを使用して、後述する AMP コール トラッカーを設定します。
方法 2: コール トラッキング コード スニペットを使用する
通話スニペットの変数 AMP 通話トラッキングでは以下に該当
ak コンバージョン ID
cl コンバージョン ラベル

この例では、akcl の値はそれぞれ 123456789_ABcDEFg12hI34567jK です。

<script>
(function(a,e,c,f,g,b,d){var h={ak:"123456789",cl:"_ABcDEFg12hI34567jK"};a[c]=a[c]||function(){(a[c].q=a[c].q||[]).push(arguments)};a[f]||(a[f]=h.ak);b=e.createElement(g);b.async=1;b.src="//www.gstatic.com/wcm/loader.js";d=e.getElementsByTagName(g)[0];d.parentNode.insertBefore(b,d);a._googWcmGet=function(b,d,e){a[c](2,b,h,d,null,new Date,e)}})(window,document,"_googWcmImpl","_googWcmAk","script");
</script>
ステップ 2: AMP 通話トラッカーを設定する

上記の値を AMP 通話トラッキング設定 URL で使用します。他の AMP モジュールと同様に、ページのヘッダーに AMP 通話トラッキング モジュールを追加する必要があります。

<head>
<script async custom-element="amp-call-tracking" src="https://cdn.ampproject.org/v0/amp-call-tracking-0.1.js"></script>
</head>

通話コンバージョンを測定できるようにするには、Click-to-Call リンクを Google 広告の通話トラッキング設定へのリンクで装飾する必要があります。

<amp-call-tracking
  config="https://www.googleadservices.com/pagead/conversion/7777777777/wcm?cl=AAAAAAAAAAAAA&tel=1800-123-4567&mode=1">
  <a href="tel:18001234567">+1-800-123-4567</a>
</amp-call-tracking>

この例を使用するには、Google 広告のコンバージョン設定時に提供されたコンバージョン トラッキング コードから取得したコンバージョン ID(この例では 7777777777)とコンバージョン ラベル(この例では AAAAAAAAAAAAA)を置き換えます。tel URL パラメータは、含まれているリンクの電話番号と一致する必要があることに注意してください。

制限事項

GCLID はリンクの装飾によって渡されるため、ユーザーが次のページに移動せずに AMP ページを閉じた場合、コンバージョン リンクは行われません。