dataLayer解説 window.dataLayer = window.dataLayer || [];

解説記事

下記は、第3回セミナーのイベント「purchase」で使用したデータレイヤーです。

<script>
  window.dataLayer = window.dataLayer || [];
  dataLayer.push({
    event: "purchase",
    ecommerce: {
      transaction_id: "100-02", 	        
      affiliation: "GA4 Quick", 		
      value: 10000, 			
      tax: 1000, 			
      shipping: 500, 			
      currency: "JPY", 			
      coupon: "2022_SPRING_SEMINAR", 	
      items: [{
        item_name: "2022_SPRING_SEMINAR_04",	
        item_id: "22ss04", 			
        price: 10000, 			
        item_brand: "and,a", 		
        item_category: "Online_Seminar", 	
        item_variant: "ZOOM", 		
        quantity: 1			
      }]
   }
  });
</script>

上記の2行目、

  window.dataLayer = window.dataLayer || [];

について解説します。

dataLayerはJavaScriptで「配列」と呼ばれるものになります。
「配列」は中にいろいろな要素をリスト形式で保有することができるもので、
そして「配列」はその要素を追加・削除・検索など行うことが可能です。

dataLayerは「継ぎ足し継ぎ足ししていく」のが本来的な使い方です。

 window.dataLayer = window.dataLayer || [];

は、「dataLayerという名前で配列を新規作成する」というものになります。
GTMはページ上にdataLayerという配列が存在したらそちらを利用する形です。
(存在しない場合はGTMが勝手に作成します)

そして、dataLayer.push()というのは上で触れた「配列に要素を追加する」ものとなり、
()の中身をdataLayerに追加する、という文法になっています。

これによって、「作成した配列に対してpurchase用のデータを追加する」形になります。


これが「継ぎ足し継ぎ足し」できる、という意味になります。追加されるデータに関して、「{ }で囲んだ範囲」はご存知かと思いますが、「event」パラメータに関しては「データの第一階層に配置する必要がある」形です。


関連記事

特集記事

コメント

この記事へのコメントはありません。

ランキング(週間)

  1. 1

    GA4の指標「総ユーザー数」VS「アクティブ ユーザー数」

  2. 2

    【祝・GPT-4 が ChatGPT plus に登場記念!】アクセス解析コンサルタントが、GPT-4にCSVデータを渡して、データ解析結果のコメントを書いてもらう方法

  3. 3

    GA4の探索で「ページ別訪問数」を見ることは可能か?

  4. 4

    GA4 「ページ ロケーション」と「ページ パス と スクリーン クラス」何が違う?ドメインの有無以外にもパラメータの扱いに違いあり

  5. 5

    UA、GA4、MAツールの数が合わない問題

  6. 6

    GA4 拡張計測機能の新顔「フォームの操作」 form_start, form_submit

  7. 7

    GA4 & Looker Studio(旧データポータル) 「割り当てエラー」問題 原因と打開策「データの抽出機能」(2023年1月14日 修正)

  8. 8

    ECサイトのゴールデンルートを発見する方法 – Google Analytics 4とPythonを活用して(第1回)

  9. 9

    GA4で異なるドメイン(サブドメイン)の同一ページパスをドメイン付きで表示する

  10. 10

    GA4 × ChatGPT 爆速!GA4 設定 & 解析 革命 第1回

最近の記事

  1. ECサイトのゴールデンルートを発見する方法 – Google Analytics 4とPythonを活用して(第2回)

  2. GA4 -> トレジャーデータ 連携術

  3. ECサイトのゴールデンルートを発見する方法 – Google Analytics 4とPythonを活用して(第1回)

カテゴリー

 
TOP