
2020年7月15日
通过GTM在Facebook Pixel中使用GA标准电子商务体彩七星彩开奖结果
在2019年,Simo Ahava发布了有关如何重用Google Analytics(分析)的指南 Facebook Pixel中增强的电子商务体彩七星彩开奖结果。虽然绝对推荐使用增强型电子商务来跟踪GA的销售,但是仍然有很多项目使用其原始的前身, 标准电子商务.
如果您不知道,则可以使用标准电子商务来跟踪 只是 销售和购买的产品。那’是的。另一方面,增强型电子商务旨在跟踪整个旅程– from 产品印象 至 添加到购物车 至 采购等
由于Simo已经提供了重用增强型电子商务体彩七星彩开奖结果的解决方案(实际上, Facebook Pixel自定义标签模板可以自动执行此操作),因此我决定为在Google Analytics(分析)中使用标准电子商务的用户提供帮助。
在本指南中,您’将通过Google跟踪代码管理器了解如何在Facebook Pixel中使用Google Analytics(分析)标准电子商务体彩七星彩开奖结果。
内容
Â
Â
要求
请记住,解决方案我’我将在此博客文章中描述仅适用于 您网站上已经配置了标准电子商务。所以,如果你没有’t yet, 请先阅读本指南 并要求开发人员帮助您。您的最终目标–开发人员(或插件)必须将格式正确的交易体彩七星彩开奖结果推送到体彩七星彩开奖结果层。
这里’是您必须已经在网站上看到的最终输出的示例’s 订单确认 页(显然,值将有所不同)。
<script> window.dataLayer = window.dataLayer || []; dataLayer.push({ 'event': 'purchase', 'transactionId': '1234', 'transactionAffiliation': 'Acme Clothing', 'transactionTotal': 38.26, 'transactionTax': 1.29, 'transactionShipping': 5, 'transactionProducts': [{ 'sku': 'DD44', 'name': 'T-Shirt', 'category': 'Apparel', 'price': 11.99, 'quantity': 1 },{ 'sku': 'AA1243544', 'name': 'Socks', 'category': 'Apparel', 'price': 9.99, 'quantity': 2 }] }); </script>
Google并不需要所有这些体彩七星彩开奖结果点。但是请记住,Google严格要求您遵循其命名约定和体彩七星彩开奖结果结构。如果您不知道如何在网站上实施标准电子商务, 阅读本指南.
有些人通过自定义HTML实现了Facebook Pixel,而其他人则在使用Simo Ahava’的Facebook Pixel自定义标签模板。在本指南中,我’将为他们两个提供解决方案。
流程
这里’是我们的过程’ll need to follow:
- 创建一个自定义JavaScript变量来检查体彩七星彩开奖结果层。如果它包含GA Standard Ecommerce体彩七星彩开奖结果,它将获取并输出体彩七星彩开奖结果的转换版本(由Facebook Pixel支持)。大学教师’不必担心,现有的GA标准电子商务体彩七星彩开奖结果层将不受影响。
- 该变量将插入到Facebook Pixel标签中’负责发送购买体彩七星彩开奖结果
代码
首先,让’看一下代码。
function() { var ecproducts = {{dlv - transactionProducts}}; if (Array.isArray(ecproducts)) { var productIds = ecproducts.map(function(products){ return !!products.sku && products.sku.toString(); }); var productTotalValue = ecproducts.reduce(function(total, current){ return !!current.price && !!current.quantity ? total + (current.price * current.quantity) : total; },0); var productQuantity = ecproducts.reduce(function(total, current){ return !!current.quantity ? total + parseInt(current.quantity) : total; },0); var contentsArr = ecproducts.map(function(products){ return { id: !!products.sku ? products.sku.toString() : undefined, item_price: !!products.price ? parseFloat(products.price) : undefined, quantity: !!products.quantity ? parseInt(products.quantity) : undefined }; }); return { content_ids : productIds, value : productTotalValue, num_items : productQuantity, contents : contentsArr, content_type : 'product' }; }; }
如果你 don’不在乎此代码的工作原理 ,只需复制此代码,然后在GTM中创建一个自定义JavaScript变量(变数> New > Custom JavaScript),粘贴代码,在变量中添加任何名称,然后跳到下一章。
如果你’有兴趣学习什么’在引擎盖下,继续阅读。
为了创建此代码,我使用了Simo’s 解作为主要灵感。
由于我们在这里使用Custom JavaScript变量,因此我们需要从匿名函数开始,该函数将返回FacebookPixel的最终对象。一开始,我定义了 电子产品 变量将 交易Products 体彩七星彩开奖结果层的阵列(I’在本博客文章的下一章中,将详细介绍该变量。
function() { var ecproducts = {{dlv - transactionProducts}}; if (Array.isArray(ecproducts)) {
所以,如果 交易Products 存在并且其类型是数组,GTM中的Custom JavaScript变量将开始构建Facebook友好的输出。
那’主要魔术发生的地方。首先,它需要 ku 数组中每个产品的结果并将其转换为字符串(如果 ku完全存在)。所有这些 骷髅 将存储在数组中。
var productIds = ecproducts.map(function(products){ return !!products.sku && products.sku.toString(); });
这是必需的,因为Facebook Pixel会期望一个名为 content_ids 包含所有已购买产品ID的数组。为了更好地理解代码的这一部分是如何工作的,您应该学习 数组映射法.
Â
Â
然后,代码准备一个参数,该参数将返回已购买的所有产品的总价值。这部分将检查 交易Products 数组。如果产品对象包含 价钱 and 数量 键,然后它将计算购买的特定产品的总价值(例如4种产品x $ 12)将返回48:
var productTotalValue = ecproducts.reduce(function(total, current){ return !!current.price && !!current.quantity ? total + (current.price * current.quantity) : total; },0);
说到 productTotalValue 上面的代码,您应该学习两个有用的知识: 数组归约法 和 三元运算符.
下一步是 数量每种产品的键并计算总量。如果一个 数量 键存在,然后将其转换为整数(如果该键的类型不同),然后将其加到总和中:
var productQuantity = ecproducts.reduce(function(total, current){ return !!current.quantity ? total + parseInt(current.quantity) : total; },0);
然后,代码将在Standard Ecommerce dataLayer.push中构建所有产品的数组,并使它对FB像素更友好。它使用 数组映射法 每个产品需要3个键:滑雪板,价格,数量。然后,它将构建一个新的数组,其中每个产品将包含3个键: id,item_price,数量。 如果产品的某个键没有退出, 未定义 will be returned.
var contentsArr = ecproducts.map(function(products){ return { id: !!products.sku ? products.sku.toString() : undefined, item_price: !!products.price ? parseFloat(products.price) : undefined, quantity: !!products.quantity ? parseInt(products.quantity) : undefined }; });
最后,让’s构建所有已处理体彩七星彩开奖结果点的最终输出。决赛 返回 语句将返回一个对象,其中所有产品ID都将存储在 content_ids 数组,总值将返回为 价值 键,产品总数将作为 num_items 关键和 内容 键将是一个包含所有产品详细信息(编号,价格,数量)的数组。
返回 { content_ids : productIds, value : productTotalValue, num_items : productQuantity, contents : contentsArr, content_type : 'product' }
在里面 要求章节在这篇博客文章中,我’ve共享了标准电子商务体彩七星彩开奖结果层推送的示例。如果我们使用自定义JavaScript变量’刚刚描述过,其输出为:
{ content_ids: ['DD44', 'AA1243544'], value: 31.97, num_items: 3, contents: [ {id: 'DD44', item_price: 11.99, quantity: 1}, {id: 'AA1243544', item_price: 9.99, quantity: 2} ] }
体彩七星彩开奖结果层变量
要使自定义代码有效(从上一章开始),您需要创建一个体彩七星彩开奖结果层变量,该变量返回 交易Products 体彩七星彩开奖结果层中的密钥。
确切命名 dlv– transactionProducts。如果要使用其他名称,请编辑代码的第二行。
function() { var ecproducts = {{dlv - transactionProducts}};
代替“dlv – transactionProduct”,输入体彩七星彩开奖结果层变量的名称。
Â
Â
Facebook Pixel标签(通过标签模板实现)
首先,我’从“自定义标签模板”开始。如果你没有’还没有创建购买标签,请转到 标签> New > Facebook Pixel 并输入以下设置:
- Facebook像素编号
- 活动名称> Standard > Purchase
如果您在其他FB Pixel标签中使用了其他配置(例如GDPR设置),请在此处也进行配置。
如果你 have no idea how to work with that template, 下载我的Facebook Pixel备忘单 (以本章上方的形式)。
然后去 对象属性>从变量加载属性 然后选择您要的“自定义JavaScript”变量’ve在本博客文章的前面创建。
Facebook Pixel还需要将货币代码与购买体彩七星彩开奖结果一起传递。如果您的网站始终只以一种货币运行,则可以像这样手动添加(当然,请输入您所用的货币代码’re using):
另外,如果货币代码存储在体彩七星彩开奖结果层中,则可以创建一个 体彩七星彩开奖结果层变量Â并在设置中使用它(此处’s an example –您可能需要根据情况进行调整):
Facebook Pixel标记(通过自定义HTML标记实现)
如果您已通过自定义HTML标签实现了Facebook Pixel,请在购买标签中使用以下代码:
<script> fbq('track', 'Purchase', {{cjs -ga电子商务交易到fb像素}}); </script>
更换 cjs–ga电子商务交易到fb像素 与您的Custom JavaScript变量的名称。此外,您应该在该自定义JS变量中进行一些更新’s code.
在决赛中 返回 语句,添加一个额外的密钥 货币 然后输入商店使用的货币代码(如果您’以一种货币重新运行)。另外,在逗号后添加逗号 内容Arr.
return { content_ids : productIds, value : productTotalValue, num_items : productQuantity, contents : contentsArr, content_type : 'product', currency : 'USD' }
此代码将始终返回美元。如果您将货币代码动态推送到体彩七星彩开奖结果层,则可以创建一个体彩七星彩开奖结果层变量,并使用该变量:
return { content_ids : productIds, value : productTotalValue, num_items : productQuantity, contents : contentsArr, content_type : 'product', currency : {{dlv - currencyCode}} }
更新/创建代码后,您可以使用与GA Standard Ecommerce代码中相同的触发器。如果需要,您也可以在以后某个时候触发Facebook Pixel购买标签(例如,当所有其他脚本 已加载)。但是请确保在将标准电子商务体彩七星彩开奖结果推送到体彩七星彩开奖结果层之前,不要触发FB Pixel标签。
添加/更新触发器后,保存标签。
让’s test
现在,时间到了可以测试设置的代码。在你之后’在容器中进行了所有更改,刷新 GTM’的预览和调试模式.
另外,您需要安装 Facebook Pixel助手 浏览器扩展。当你’为此,请在您的网站上购买。当您这样做时,您应该看到Facebook Pixel助手’的图标已更改为蓝色。点击它。
在跟踪的各种事件中,您还应该看到Purchase事件。单击它以查看发送了哪种自定义参数。这些参数必须与您在GTM预览模式下看到的电子商务体彩七星彩开奖结果匹配’s data layer tab.
如果你 cannot see the 采购 事件,请检查您的FB Pixel Purchase标签是否完全触发了。就我而言,dataLayer.push使用事件值 交易。因此,我单击了它,并检查了代码是否触发。
如果你r tag is not firing, 阅读本故障排除指南.
下一个可以检查的地方是 business.facebook.com。登录到该帐户,转到“事件管理器”并打开要将购买体彩七星彩开奖结果发送到的那个Pixel。如果您不知道如何浏览Facebook’的业务经理界面, 本指南应为您提供帮助.
然后去 测试事件 并检查是否看到购买事件(系统会要求您输入您的网站’s URL).
看到事件后,单击它以检查发送了哪种体彩七星彩开奖结果。
如果您没有使用动态广告,请随时忽略以下警告:
- 像素和目录未配对
然后’s’ about it!
如何在Facebook Pixel中重用GA标准电子商务体彩七星彩开奖结果:最后的话
这篇博客文章是您可以感受到Google跟踪代码管理器强大功能的情况之一。您可以重用已经存在的体彩七星彩开奖结果,而不必要求开发人员将FB像素友好的体彩七星彩开奖结果推送到体彩七星彩开奖结果层。
当然,此选项需要一定的编码知识,但是请相信我,能够实现类似的目标非常有意思。
有任何疑问吗?随时在下面发表评论。
Â
Â
发表评论