GA4 e コマース（gtag.js）: ユニバーサル アナリティクスのイベントを送信する

このガイドでは、既存の gtag.js ユニバーサル アナリティクス（UA）e コマース実装を使用して、e コマース イベントを Google アナリティクス 4（GA4）プロパティに送信する方法を説明します。

その他の移行ガイドとリソースについては、デベロッパー移行センターをご覧ください。

結果

このガイドに従うと、既存の UA 実装を使って新しい GA4 プロパティのデータが入力されることになります。つまり、既存の UA 実装はそのままで、UA e コマース レポートに引き続きデータが取り込まれ、新しい GA4 プロパティもデータの受信を開始します。

始める前に

  1. e コマース移行ヘルパーツールを使用して、現在の実装が次の条件を満たしていることを確認してください。

    • UA プロパティを使用していること
    • サイトで gtag.js ライブラリを使用して e コマース イベントを送信していること

  2. 各オプションのトレードオフについては、e コマース実装の移行オプションをご覧ください。このガイドの手順に従うと、既存の gtag.js UA 実装が GA4 に使用されることになります。そのような結果を本当に望んでいるかどうかをご確認ください。

  3. GA4 プロパティへの送信時の UA イベントの変換方法については、イベント互換性に関するリファレンスをご覧ください。

トレードオフと考慮事項

以下の情報をご確認のうえ、既存の gtag.js（UA）e コマース実装を GA4 プロパティで使用する場合の影響について十分に理解するようにしてください。

メリット デメリット
  • 既存の e コマース イベントタグを変更する必要がないため、最も簡単な実装方法です。
  • GA4 と UA のレポートの両方で e コマースデータを確認できます。
  • UA プロパティでの e コマースデータの収集方法とレポート方法に変更はありません。
  • select_content、checkout_progress、set_checkout_option、view_refund イベントは GA4 で認識されないため、GA4 e コマース レポートには表示されません。
    • 上記のイベントとそれらに関連するパラメータは、GA4 ではカスタム イベントとカスタム パラメータとして扱われます。ただし、items パラメータはカスタム パラメータとしてサポートされていないため、データは Google アナリティクスに送信されません。
  • GA4 の「カートの詳細 / 離脱」目標到達プロセス レポート内の「配送情報を追加」ステップは空になります。
  • GA4 の「商品 / サービス / アイテムリスト」目標到達プロセス レポートの「リストクリック」ステップは空になります。
  • カテゴリの / 区切り文字は GA4 で認識されません。 ですから、GA4 では cat1/cat2/cat3 は 3 つのカテゴリ（cat1、cat2、cat3）ではなく 1 つのカテゴリとしてレポートされます。

実装

既存の gtag.js UA の実装を使用して e コマース イベントを GA4 プロパティに送信するには、次のいずれかのオプションを行ないます。

オプション 1: GA4 設定アシスタントを使用し、接続済みのサイトタグを有効にする

GA4 設定アシスタントを使用すると、新しい GA4 プロパティが自動的に作成され、UA プロパティから設定（プロパティ名、ウェブサイトの URL、タイムゾーン、通貨の設定）がコピーされます。また、接続済みのサイトタグ機能を有効にして、既存の UA gtag.js 実装を再利用し、新しい GA4 プロパティを読み込むこともできます。

GA4 設定アシスタントの手順に沿って、新しい GA4 プロパティを作成して設定してください。接続済みのサイトタグ機能を使用するには、[既存のタグを使用してデータ収集を有効にします] オプションを必ずオンにします。

オプション 2: gtag.js スニペットを更新する

  1. 新しい GA4 プロパティを作成します。
    • GA4 設定アシスタントを使用して、GA4 プロパティを追加しますが、設定時に表示されるプロンプトで [既存のタグを使用してデータ収集を有効にします] オプションはオフにします。別の方法として、GA4 設定アシスタントを使用せずに GA4 プロパティを作成することもできます。ただし、設定アシスタントを使用すると、UA プロパティから一部の基本設定がコピーされると言う利点があります。
  2. GA4 プロパティの測定 ID を見つけます。
  3. 測定 ID が指定された config コマンドを使用して、既存の gtag.js スニペットに GA4 プロパティを追加します。

以下は、UA と GA4 プロパティを設定した gtag.js スニペットの例です。

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXX-Y');         // Universal Analytics property.
  
  gtag('config', 'TAG_ID');  // Google Analytics 4 property.
  
</script>