如何使用 GTM 将第二个产品推入数据层答案

【问题标题】：How to push a second product into the data layer with GTM如何使用 GTM 将第二个产品推入数据层
【发布时间】：2015-08-13 14:30:57
【问题描述】：

我正在使用 Google 跟踪代码管理器为 Google 分析修补增强型电子商务报告代码 - 通过屏幕抓取数据以用于流程中的结帐步骤。代码如下所示：

var els = document.querySelectorAll('div.field_cart');

Array.prototype.forEach.call(els,function(element){

dataLayer.push({
  'event': 'checkout',
  'ecommerce': {
      'checkout': {
        'actionField': {'step': 1, 'option': 'Visa'},
        'products': [{
            'id': $('div.field_cart')[0].innerText,
        'price': $('div.field_cart')[1].innerText.match(/[0-9]+/),
        'quantity': $('div.field_cart')[2].innerText
     }//,{}...//
    ]
  }
 });
})

问题在于，如果有多个项目 - 第二个会覆盖第一个等而不是被推送...我想知道如何追加新产品到产品对象？

【问题讨论】：

标签： javascript google-analytics e-commerce google-tag-manager google-datalayer

【解决方案1】：

因为您不能单独推送产品，所以您需要构建包含所有产品的对象。

第一步是检索已经在 dataLayer 中的对象（即使是空的）
获取产品对象
将新项目推入内部
将整个对象推送到数据层

如果您在这些步骤中遇到任何问题，请告诉我。

尝试先定义 dataLayer 变量：

var dataLayer = window.dataLayer || [];

它将采用现有的 dataLayer 变量并添加使用它，或者如果没有，它将为其创建数组。

另外，我可以看到您使用的是小写的“数据层”。应该是“dataLayer”。

我希望这会有所帮助。

【讨论】：

是GTM加载后添加的吗？还是它与html一起交付？如果它是某些 GTM 标签的一部分（因此在加载 GTM 后加载），它将阻止事件。只需将其替换为 var dataLayer = window.dataLayer || [];
谢谢，页面上定义了dataLayer，但是数据是通过GTM抓取和推送的。

【解决方案2】：

我发现谷歌标签管理器重新连接了dataLayer.push() 方法来触发事件并保护数据层的大小。副作用是它没有按预期运行。解决这个问题的方法是将所有抓取的产品数据推送到一个 javascript 变量中，一旦准备好，将该变量推送到dataLayer，如下所示：

function scrape2DL() {    
    dataLayer.push({'ecommerce.checkout.actionField': {step: 2}}); //action object

    var base = 0; 
    var products=[];
    while (base < $('div.field_cart').length/4) {
       products.push([{id: $('div.field_cart')[4 * base + 0].innerText, price: $('div.field_cart')[4 * base + 1].innerText.match(/[0-9]+/), quantity: $('div.field_cart')[4 * base + 2].innerText}]);
       base += 1;
    }//while 
    dataLayer.push({'ecommerce.checkout.products': products}); // add a product 
 }
 scrape2DL();
 dataLayer.push({event: 'checkout'});      // for GTM triggers

但事实证明，可以使用数据层的 get 方法将产品从数据层获取到 javascript 变量中，然后将更多产品附加到其中。但是我最终避免了这种方法，因为它跳过了连接到dataLayer.push() 的事件和大小保护检查。

以下资源有所帮助：

所以问题标题为Console returns value but Google Tag Manager variable does not
Google Tag Manager For Nerds 来自 Simo Ahava。

【讨论】：