本文将适用于 Universal Analytics (UA) 媒体资源的电子商务代码与适用于 Google Analytics(分析)4 (GA4) 媒体资源的等效代码进行比较。要植入两种代码(即同时填充 UA 媒体资源和 GA4 媒体资源),请包含适用于 UA 媒体资源和 GA4 媒体资源的代码。
要使电子商务代码发挥作用,需使用基本的页面代码。
查看您的现有检测设置
查看您的现有电子商务检测设置,该设置可能基于以下三种情况之一:
- 搭配使用 analytics.js 与标准电子商务
- 搭配使用 analytics.js 与增强型电子商务
- 搭配使用 gtag.js 与标准电子商务或增强型电子商务
如果您搭配使用 analytics.js 与标准电子商务
以下 analytics.js 代码展示了标准(非增强型电子商务)交易的硬编码图示。如果您在自己的 UA 媒体资源中搭配使用 analytics.js 与非增强型电子商务,则现有交易的代码将类似于以下代码。
// Start Google Analytics analytics.js ecommerce transaction
ga('ecommerce:addTransaction', {
'id': '1234', // Note: In gtag.js below, ‘id’ maps to “transaction_id”
'affiliation': 'Google online store',
'revenue': '23.07',
'shipping': '0',
'tax': '1.24'
});
ga('ecommerce:addItem', {
'id': '1234', // Note: In gtag.js below, “items”:[{“id”}] is the item SKU, not the transaction ID
'name': 'Android Warhol T-Shirt',
'sku': 'P12345', // In gtag.js below, ‘sku’ maps to “items”:[{“id”}]
'category': 'Apparel/T-Shirts',
'price': '2.0',
'quantity': '2'
});
ga('ecommerce:addItem', {
'id': '1234',
'name': 'Flame challenge TShirt',
'sku': 'P67890',
'category': 'Apparel/T-Shirts',
'price': '3.0',
'quantity': '1'
});
ga('ecommerce:send');
如果您搭配使用 analytics.js 与增强型电子商务
以下 analytics.js 代码展示了增强型电子商务交易的硬编码图示。如果您在自己的 UA 媒体资源中搭配使用 analytics.js 与增强型电子商务,则现有交易的代码将类似于以下代码。
ga('create', 'UA-XXXXX-Y', 'auto');
ga('require', 'ec');
ga('ec:addProduct', {
'id': 'P12345', // SKU
'name': 'Android Warhol T-Shirt',
'category': 'Apparel/T-Shirts',
'quantity': 2,
'price': 2,
});
ga('ec:addProduct', {
'id': 'P67890', // SKU
'name': 'Flame Challenge TShirt',
'category': 'Apparel/T-Shirts',
'quantity': 1,
'price': 3,
});
ga('ec:setAction', 'purchase', {
'id': 'T12345', // Transaction id
'affiliation': 'Google Store - Online',
'revenue': 23.07,
'tax': 1.24,
'shipping': '0',
});
ga('send', 'pageview');
如果您使用 gtag.js
如果您在自己的 UA 媒体资源中使用 gtag.js,则无需添加其他代码。您的现有电子商务衡量代码仍适用于 GA4 媒体资源。要同时针对 UA 和 GA4 为您的网站添加代码,请将 GA4 媒体资源添加到您现有的 gtag.js 配置:
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y">
</script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXX-Y');
gtag('config', 'G-XXXXX'); // Added Google Analytics 4 ID
</script>
适用于 Google Analytics(分析)4 的等效电子商务衡量代码
以下部分介绍了适用于 GA4 媒体资源的等效电子商务衡量代码(gtag.js 和 Google 跟踪代码管理器)
针对等效 Google Analytics(分析)4 交易使用 gtag.js
上述 analytics.js 代码(针对标准电子商务和增强型电子商务)与以下适用于 GA4 媒体资源的 gtag.js 衡量代码相对应。
gtag('event', 'purchase', {
"transaction_id": "1234",
"affiliation": "Google online store",
"value": 23.07,
"currency": "USD",
"shipping": 0,
"tax": 1.24,
"items": [
{
"id": "P12345", // Note that this is the SKU, not the transaction ID
"name": "Android Warhol T-Shirt",
"category": "Apparel/T-Shirts",
"quantity": 2,
"price": '2.0'
},
{
"id": "P67890", // Note that this is the SKU, not the transaction ID
"name": "Flame challenge TShirt",
"category": "Apparel/T-Shirts",
"quantity": 1,
"price": '3.0'
}
]
});
如需详细了解电子商务衡量代码,请参阅针对 gtag.js 的 GA4 电子商务开发者指南。
如果您使用 Google 跟踪代码管理器
如果您在 UA 媒体资源中使用 Google 跟踪代码管理器,请添加 Google Analytics(分析)GA4 事件代码,并将其配置为发送电子商务事件数据。
- 依次点击代码 > 新建。
- 点击代码配置。
- 选择 Google Analytics(分析):GA4 事件。
- 对于配置代码,请选择相应的配置代码。
- 对于事件名称,请输入
purchase
。 - 展开事件参数部分,并添加上述 gtag.js 示例中列出的每个参数的参数名称和值。在大多数情况下,您需要使用跟踪代码管理器变量来填充这些值。
- 点击触发条件,然后选择可触发电子商务事件的适当事件。
- 保存代码配置并发布您的容器。
如需详细了解电子商务衡量代码,请参阅针对 Google 跟踪代码管理器的 GA4 电子商务开发者指南。