将特定动作后的变量传递给GTM数据层

Question

正如标题所示，在动作完成后我需要将变量传递给GTM数据层。 更具体地说，我想在datepicker中选择日期之后将巡回日期传递给GTM Layer。

我不知道什么是正确的做法。现在，我有以下数据层脚本：

<script > 
    var dataLayer = [({ 
     "customerLoggedIn": 0, 
     "customerId": 0, 
     "customerGroupId": "1", 
     "customerGroupCode": "GENERAL", 
     "productId": "6", 
     "productName": "Big Loop Boat Tour", 
     "productSku": "boat-tour", 
     "productPrice": "0.00", 
     "productPriceExcludingTax": "0.00", 
     "productTax": "0.00", 
     "productTaxRate": 0, 
     "productGender": false, 
     "pageType": "catalog\/product\/view" 
    })]; 
    dataLayer.push({ 
     'ecommerce': { 
      "detail": [{ 
       "id": "6", 
       "name": "Big Loop Boat Tour", 
       "sku": "boat-tour", 
       "price": 0, 
       "priceexcludingtax": "0.00", 
       "tax": "0.00", 
       "taxrate": 0, 
       "brand": "", 
       "gender": false, 
       "category": null, 
       "children": [] 
      }] 
     } 
    }); 
    (function(w, d, s, l, i) { 
     if (i == '') { 
      return console.log('No GTM ID provided'); 
     } 
     w[l] = w[l] || []; 
     w[l].push({ 
      'gtm.start': new Date().getTime(), 
      event: 'gtm.js' 
     }); 
     var f = d.getElementsByTagName(s)[0], 
      j = d.createElement(s), 
      dl = l != 'dataLayer' ? '&l=' + l : ''; 
     j.async = true; 
     j.src = '//www.googletagmanager.com/gtm.js?id=' + i + dl; 
     f.parentNode.insertBefore(j, f); 
    })(window, document, 'script', 'dataLayer', 'XXXXXXXX'); 
</script> 

我应该添加额外的变量到数据层阵列？让说selectDate，它将在页面加载时未定义。

var dataLayer = [({ 
     "customerLoggedIn": 0, 
     "customerId": 0, 
     "customerGroupId": "1", 
     "customerGroupCode": "GENERAL", 
     "productId": "6", 
     "productName": "Big Loop Boat Tour", 
     "productSku": "boat-tour", 
     "productPrice": "0.00", 
     "productPriceExcludingTax": "0.00", 
     "productTax": "0.00", 
     "productTaxRate": 0, 
     "productGender": false, 
     "pageType": "catalog\/product\/view" 
     "selectedDate" : "" 
    })]; 

将javascript函数添加到页面以获取选定日期并将其写入变量$date.selected。

，并创建GTM的自定义标签的日期选择器点击触发的，这个自定义脚本

<script> 
    dataLayer.push({"selectedDate": $date.selected});  
</script> 

这看起来对吗？

或者我可以在主数据层脚本中传递变量吗？

<script > 
    var dataLayer = [({ 
     "customerLoggedIn": 0, 
     "customerId": 0, 
     "customerGroupId": "1", 
     "customerGroupCode": "GENERAL", 
     "productId": "6", 
     "productName": "Big Loop Boat Tour", 
     "productSku": "boat-tour", 
     "productPrice": "0.00", 
     "productPriceExcludingTax": "0.00", 
     "productTax": "0.00", 
     "productTaxRate": 0, 
     "productGender": false, 
     "pageType": "catalog\/product\/view", 
     "selectedDate": $date.selected 
    })]; 
    dataLayer.push({ 
     'ecommerce': { 
      "detail": [{ 
       "id": "6", 
       "name": "Big Loop Boat Tour", 
       "sku": "boat-tour", 
       "price": 0, 
       "priceexcludingtax": "0.00", 
       "tax": "0.00", 
       "taxrate": 0, 
       "brand": "", 
       "gender": false, 
       "category": null, 
       "children": [] 
      }] 
     } 
    }); 
    (function(w, d, s, l, i) { 
     if (i == '') { 
      return console.log('No GTM ID provided'); 
     } 
     w[l] = w[l] || []; 
     w[l].push({ 
      'gtm.start': new Date().getTime(), 
      event: 'gtm.js' 
     }); 
     var f = d.getElementsByTagName(s)[0], 
      j = d.createElement(s), 
      dl = l != 'dataLayer' ? '&l=' + l : ''; 
     j.async = true; 
     j.src = '//www.googletagmanager.com/gtm.js?id=' + i + dl; 
     f.parentNode.insertBefore(j, f); 
    })(window, document, 'script', 'dataLayer', 'XXXXXXXX'); 
</script> 

Answer 1

没有必要在开始时将变量定义为未定义（或空字符串）。动作完成后，只需将想要的值推送到dataLayer即可。对于您的情况，由于用户可能会改变主意并再次更改日期选择器的值，因此可能会在dataLayer中多次推送新日期。

每当您向dataLayer添加内容时，都会推送新的“消息”。将dataLayer想象成一个数组，其中包含您推送的所有消息。

在页面加载时初始化将只添加一个没有值的变量条目。