GTMとGA4の連携を深める「データレイヤー変数」とは？
GA4（Googleアナリティクス4）とGTM（Googleタグマネージャー）を連携させると、ページビューやクリックなどの標準的な計測は簡単にできます。しかし、「JavaScriptの実行結果」や「フォームの入力エラーの種類」「画面には表示されていない商品ID」など、もう一歩踏み込んだデータを取得したい場合には、標準機能だけでは限界があります。
そこで活躍するのが、データレイヤー（dataLayer）とデータレイヤー変数です。これらを活用することで、Webサイトの裏側で動いている詳細な情報をGA4に送信し、より深い分析が可能になります。
データレイヤー（dataLayer）の基本的な仕組み
データレイヤーとは、Webサイト（JavaScript）とGTMの間でデータを受け渡すための「箱」のようなものです。
通常、Webサイト上で発生したJavaScriptの処理結果や裏側のシステムデータは、そのままではGTMに認識されません。そこで、サイト側からデータレイヤーという箱に情報を入れ（これを「プッシュ」と呼びます）、GTMがその箱の中身を定期的に監視して読み取る、という仕組みになっています。
GTMの「データレイヤー変数」の役割
サイト側からデータレイヤーの箱に入れられた情報の中から、特定の値だけを取り出してタグの計測に使えるようにしたものが、GTMのデータレイヤー変数です。
例えば、JavaScriptの処理結果として「処理成功」というテキストがデータレイヤーに送られたとします。GTM上でデータレイヤー変数を作成しておくことで、この「処理成功」という値をGA4のイベントパラメータにセットして送信できるようになります。
JavaScriptの実行結果をGA4に渡す5つのステップ
実際に、ページのJavaScriptが動いた結果現れるデータをGA4に渡すための具体的な手順を解説します。
1. サイト側でデータをdataLayerにプッシュする
まずは、WebサイトのHTMLやJavaScriptの記述を変更し、送りたいデータをデータレイヤーにプッシュします。以下はデータの受け渡しイメージです。
dataLayer.push({ 'event': 'js_action', 'action_result': 'success' });この記述により、「js_action」というイベントが発生したタイミングで、「action_result」というキーに「success」という値が格納されます。
2. GTMで「データレイヤーの変数」を作成する
GTMの管理画面を開き、新しく変数を作成します。変数のタイプで「データレイヤーの変数」を選択し、データレイヤーの変数名に先ほどのキー名である「action_result」を入力して保存します。
3. GTMでカスタムイベントトリガーを作成する
次に、タグを動かすタイミング（トリガー）を設定します。トリガーのタイプで「カスタム イベント」を選択し、イベント名に先ほどの「js_action」を指定します。これにより、JavaScriptから対象のデータがプッシュされた瞬間にタグを動かすことができます。
4. GA4イベントタグにパラメータとして設定する
GTMでGA4のイベントタグを新規作成します。トリガーにはステップ3で作成したものを指定します。さらに、「イベントパラメータ」の項目を開き、パラメータ名を決めた上で、値としてステップ2で作成したデータレイヤー変数を指定します。
5. GA4でカスタムディメンションに登録する
GTMの設定を公開してデータが送信されるようになったら、最後にGA4側での設定が必要です。GA4の管理画面から「カスタムディメンション」を新規作成し、ステップ4で設定したイベントパラメータ名を登録します。これで、GA4のレポート画面でJavaScriptの実行結果を分析できるようになります。
まとめ
GTMのデータレイヤー変数を活用すれば、単純なクリックやページビューだけでなく、JavaScriptの実行結果や動的なデータなど、サイト固有の深い情報をGA4に送ることができます。
設定にはサイト側へのコード追加とGTM側での変数・トリガー・タグ設定が必要になりますが、一度仕組みを作ってしまえば、分析の幅が劇的に広がります。より高度なデータ活用を目指す方は、ぜひデータレイヤー変数の設定に挑戦してみてください。
