谷歌标签管理器和高级电子商务 - 交易产品

Question

我正在尝试配置高级电子商务分析以从订单确认页面读取交易数据。

我正在从Dom元素上刮取数据，因为这是我唯一可用的选项。

我能够读取transactionId，transactionTotal，transactionShipping等字段，但无法读取transactionProducts。 （我只能阅读1个产品，但如果订单中有多个产品，则不会更多）。

我的数据层已被添加为自定义HTML标记，像这样 -

<script>  
window.dataLayer = window.dataLayer || [] 
    dataLayer.push({ 
     'transactionId': {{transactionId}}, 
     'transactionAffiliation': 'Company name',  
     'transactionTotal': {{transactionTotal}}, 
     'transactionTax': 0, 
     'transactionShipping': {{transactionShipping}}, 
     'transactionProducts': [{ 
      'sku': {{productCode}}, 
      'name': {{transactionName}}, 
      'category': 'Generic category', 
      'price': {{transactionPrice}}, 
      'quantity': {{transactionQuantity}} 
     }] 
    }); 
</script> 

的字段自定义JavaScript变量。

例如 -

TRANSACTIONID -

function() { 
    var transactionId = document.querySelector([id*='OrderNumberValue']").textContent; 
return transactionId; 
} 

一旦标签被确认页面数据层看起来像这样（你可以看到，只有1个交易产品返回时，在发射有2个产品的顺序） -

Window Loaded: 
    {event: 'gtm.load'} 
    transactionId: '1000001', 
    transactionAffiliation: 'Company name', 
    transactionTotal: '10.00', 
    transactionTax: 0, 
    transactionShipping: '0.00', 
    transactionProducts: [ 
    { 
     sku: 'SAMPLE1', 
     name: 'Sample product', 
     category: 'Generic category', 
     price: '5.00', 
     quantity: '1' 
    }] 
} 
{gtm.start: 1474472447660, event: 'gtm.js'} 

真的很感激任何意见。

感谢

Answer 1

这不是真的回答的，只要你不显示您的产品HTML的外观，但基本上你会使用Document.querySelectorAll上包含产品的元素，然后遍历这些结果并从每个单独结果的内部元素中选择值。分配给（临时）产品对象，添加到您的交易产品，等等每次迭代。

var results= document.querySelectorAll('.product'); 

transactionProducts = []; 
for (i = 0; i < results.length; ++i) { 
result = results[i]; 
tmp = {}; 
tmp.price = result.querySelector('.sku').textContent; 
tmp.price = result.querySelector('.price').textContent; 
transactionProducts.push(tmp); 
} 

没有真正的测试或任何东西（当然有更优雅的方式来迭代nodelists），但这应该给你一个想法。