データレイヤーがなければ、「購入完了ページで決済金額をGA4に渡す」ことは容易ではない。開発者は毎回GA4コードを直接修正する必要があります。データレイヤーを用意すると、開発者はページイベント発生時に決まった形式で dataLayer.push() だけ呼び出し、GTM はそのデータを受け取り、GA4・Google Ads に渡す。
構造は、window.dataLayer配列にオブジェクトをプッシュする方法です。例: dataLayer.push({'event':'purchase','value':150000,'item_name':'施術名'})。 GTMのデータレイヤー変数はこの値を読み取り、タグパラメータとして使用します。
weballinは、病院サイトで電話クリック(tel:アンカー)、予約フォーム送信、カカオトークチャンネルクリックでデータレイヤを標準設計します。特に、SPA(React / Next.js)環境では、ページ移動時にデータレイヤーが初期化されないように、履歴API連携設計が必要です。
要点
- ページイベントデータをGTMとGA4が読み取ることができる標準形式に構造化する。
- 開発者とマーケティング担当者の役割を分離する:開発者はデータレイヤープッシュ、マーケティング担当者はGTMタグを設定します。
- Eコマースイベント(view_item・add_to_cart・purchase)を標準GA4スキーマに配信する。
- SPA(React/Next.js/Vue)でページ移動イベントをデータレイヤーに手動でトリガーします。
- GTMデータレイヤー変数でプッシュされた値をタグパラメータに自動的に関連付けます。
