增强型电子商务(Enhanced Ecommerce)是Google Analytics(分析)提供的一款收集电子商务类型网站,特别是跨境电商网站,用户行为数据以及交易数据功能的一个功能组件。顾名思义,增强型电子商务是一组维度,指标和报告的集合体,它们结合在一起可以为企业用户提供一个相当完整的交易数据视图,目的是了解用户如何在你的Webstore中产品进行交互以及网络产品营销的交易情况,虽然增强型电子商务的实施起来也许有点复杂,需要你了解 js 技术,以及数据传输的一些知识点。
不过不需要担心,谷歌出了Google跟踪代码管理器,也就是Google tag manager。这个工具很大程度上方便了代码的布置以及提高了数据的传输效率。你可以通过Google跟踪代码管理器实施增强型电子商务的部署,而无需在网站上添加各种代码,比如可以通过简单地对象模型(DOM)来完成一些操作。
增强型电子商务在GTM运作需要哪些知识?
还有我们经常遇到的 dataLayer 数据层,它的主要作用在于数据收集以及数据的推送,这个数据层我们是要几个常用的,所以大家最好对此熟知。而且,我们还需要了解DOM抓取得原理,以及前端 HTML 文档或 JavaScript 代码的一些基础知识。因为这些都是将要在 Ecommerce 值中被填充到dataLayer
,而不需要使用DOM直接抓取或在网站上添加各种乱七八糟的 JavaScript 代码,做技术嘛,效率方便也是非常重要的。
1、dataLayer.push()
这段代码也许大家很陌生,可以这样去理解,它是专门负责推送数据的,push即推的意思,也就是把收集的数据推送给Google服务器进行识别。例如增强型电子商务的点击数据需要它推送到dataLayer
自定义JavaScript变量里面去或使用自定义JavaScript变量生成的对象的特定语法中去。例如,dataLayer.push() 中购买行为数据所需电子商务代码看起来像这样:
window.dataLayer = window.dataLayer || []; window.dataLayer.push({ event: 'eec.purchase', ecommerce: { purchase: { actionField: { id: '1' }, products: [{ id: 'p' }] } } });
注意,Google跟踪代码管理器仅对 dataLayer.push() 命令作出反应。在GTM中,没有其他数组方法可以做和它一样的事情,所以 dataLayer 代码中都必须进行 push() 一下。还有就是以上代码只是官方推荐的基本代码,当然还有其他的写法。本篇就简单说一下基本的写法了,放不理解!记住在数据推送过程中,ecommerce
需要被包括在列出的所有键下面,event
我也是建议将密钥添加到每个dataLayer.push()
对象去,其中的 event 也就是你将要在 GA 中添加的事件。
通过使用event事件,我可以在ga中查看“热门事件”报告,以查看发送给GA的所有增强型电子商务数据匹配。你也可以添加订单ID之类的内容作为这些匹配的“事件标签”,这样做的好处就是在处理大数据时候,很容易辨别哪些订单是有问题的或者哪些订单是非常突出的,一目了然。
接下来你要做的,就是将需要使用相关值来填充对象中的键,这个技术需要技术开发人员来帮助,因为这些数据都是动态生成的,我上面给的代码是静态的,这个要注意下。例如ecommerce.purchase.actionField.id
必须是订单本身的唯一标识符,不可以是多样的,不然数据传输就会报错,或者你可以使用 JavaScript 随机生成一个。这样,你以后就可以使用数据动态填充来收集有关此事务的详细数据信息了。
使用数据层将数据发送到Google Analytics(分析)
你还需要做的就是确保放入的对象 dataLayer 完全正确的语法,并确保成功的将其传入到 GA 当中去,所以你还需要在gtm中给数据层打钩,大概是以下的效果:
2、使用自定义JavaScript变量将数据发送到Google Analytics(分析)
dataLayer 在Google跟踪代码管理器中使用主要原因之一是它的刚性,但是某些时候“使用数据层”选项要求你遵循非常具体,笨重的语法所以当你处理大型的站点的时候,往往显得很笨拙,不方便去管理,这个时候你就可以考虑使用自定义 JS 的手法。Google跟踪代码管理器还允许你使用自定义 JavaScript 变量发送数据。
使用变量需要做的就是返回一个有效的ecommerce
对象。当然,变量需要返回的内容与开发人员dataLayer
在理想环境中要推送的内容是完全相同的。这样做的好处就是开发人员的自定义性会强的多,结合js的强大功能性,可以做很多事情。可以将电子商务数据先 dataLayer
以格式推送,然后使用 Custom JavaScript 变量将其转换为有效ecommerce
对象即可。
举个例子,如果需要向其添加一些动态更新(例如,产品的一些自定义维度),也可以修改有效的 ecommerce
对象dataLayer
。例如,这是我向“ 购买”对象中的所有产品添加产品范围的自定义维度的 js 代码:
function() { // Create a copy of the variable to avoid // modifying the source object by reference var ecom = JSON.parse(JSON.stringify({{Data Layer Variable - ecommerce}})); try { ecom.purchase.products.forEach(function(prod) { prod.dimension10 = {{get discount}}(prod.id); }); } catch(e) {} return { ecommerce: ecom }; }
通过这个简单的示例,我通过向每个产品添加新字段来更新一个完全有效的ecommerce
对象(由{{Data Layer Variable-ecommerce}}表示),由于是基础教程,在这里,也就不讲的太深了。
这是dataLayer.push()
产品详细信息代码的样子,其中填充了所有相关的键值:
window.dataLayer = window.dataLayer || []; window.dataLayer.push({ event: 'eec.detail', ecommerce: { detail: { actionField: { list: 'Search Results' }, products: [{ id: 'product_id', name: 'MY PRODUCT', category: 'guides/google-tag-manager/enhanced-ecommerce', variant: 'Text', brand: 'SIMO AHAVA', dimension3: 'Ecommerce', metric5: 12, metric6: 1002 }] } }
记住,如果要使用自定义JavaScript变量,则该变量必须返回上述ecommerce
对象dataLayer.push()
。
最后实际gtm配置大概是这样的,当然实际过程配置还是比较麻烦的,所以大家还是需要很多耐心,打好基础才是最重要的,可以在实践中多看看此文,加深理解:
此外还需要注意,在配置之前,你需要去Google analytics中去把增强型电子商务功能开启,也就是说,你需要另外开启一个数据视图,来收集这些电子商务数据。
更多增强型电子商务,请查看:http://www.rrdaj.com/search/增强型电子商务/