免费工具 埋点代码生成器:GA4 dataLayer、GTM 和 TapCub SDK 一次写好
从 Google 的 35 个推荐事件里选一个,填上参数,复制现成的 dataLayer.push 和对应的 Google 跟踪代码管理器(GTM)配置;不用 GTM 的拿 gtag 写法。做国内站点、小程序、App 的,同一个事件直接生成 TapCub 统计脚本和 SDK 的调用。必填参数、币种、商品金额合计、GA4 命名上限边输边查。
- dataLayer · gtag · GTM
- 按 Google 规则检查
- 本地生成
选事件,拿代码
参数一行一个,写成 名称=值;换事件时会填入 Google 文档里的示例值。值加上引号就一定按文本处理(比如 "00123" 这种订单号)。
字母开头,只用字母、数字、下划线。
一行一个 名称=值,# 开头的行忽略。
一行一个商品:item_id=…; item_name=…; price=…; quantity=…
检查结果
- 通过和 Google 文档里这个事件的要求一致。
window.dataLayer = window.dataLayer || [];
dataLayer.push({ ecommerce: null }); // 先清掉上一个电商对象(Google 文档的写法)
dataLayer.push({
event: "purchase",
ecommerce: {
currency: "CNY",
value: 72.05,
customer_type: "new",
transaction_id: "T_12345",
coupon: "SUMMER_SALE",
shipping: 5.99,
tax: 3.6,
items: [
{
item_id: "SKU_12345",
item_name: "纯棉短袖 T 恤",
item_category: "服装",
price: 10.01,
quantity: 3
},
{
item_id: "SKU_12346",
item_name: "女款灰色 T 恤",
item_category: "服装",
price: 21.01,
quantity: 2
}
]
}
});放在动作真正完成的地方(订单确认后、加购成功后……)。
1. 不用建变量:代码直接读 ecommerce 对象。
2. 触发器 › 新建 › 自定义事件(Custom Event)
事件名称:purchase 触发条件:所有自定义事件
3. 代码(Tags)› 新建 › Google Analytics:GA4 事件
衡量 ID:G-XXXXXXXXXX(和网页上的 Google 代码同一个 ID)
事件名称:{{Event}}(或直接填 purchase)
更多设置 › 电子商务 › 勾选「发送电子商务数据」,数据源选「数据层」(英文界面:More Settings › Ecommerce › Send Ecommerce data,Data Source: Data Layer)
触发条件:选上面的「purchase」自定义事件触发器
4. 预览:打开 Tag Assistant 走一遍操作,再到 GA4 的 DebugView 看事件。一个事件一个触发器、一个代码。电商事件直接读 ecommerce 对象,不用建变量。
Google 文档里这个事件的参数
| 参数 | 类型 | 必填 | Google 文档示例值 | 你的输入 |
|---|---|---|---|---|
currency | 字符串 | 条件必填 | USD | 已填 |
value | 数字 | 条件必填 | 72.05 | 已填 |
customer_type | 字符串 | 否 | new | 已填 |
transaction_id | 字符串 | 是 | T_12345 | 已填 |
coupon | 字符串 | 否 | SUMMER_SALE | 已填 |
shipping | 数字 | 否 | 5.99 | 已填 |
tax | 数字 | 否 | 3.6 | 已填 |
items | 商品数组 | 是 | — | 已填 |
// 页面上要先装好 Google 代码(gtag.js)
gtag('event', "purchase", {
currency: "CNY",
value: 72.05,
customer_type: "new",
transaction_id: "T_12345",
coupon: "SUMMER_SALE",
shipping: 5.99,
tax: 3.6,
items: [
{
item_id: "SKU_12345",
item_name: "纯棉短袖 T 恤",
item_category: "服装",
price: 10.01,
quantity: 3
},
{
item_id: "SKU_12346",
item_name: "女款灰色 T 恤",
item_category: "服装",
price: 21.01,
quantity: 2
}
]
});网页直接装了 gtag.js、没有 GTM 时,用它代替上面的 dataLayer.push。
安装和初始化见 TapCub 文档;这里只用文档里写了的方法。
分享这组输入:数值写在链接的 # 后面,不会发到服务器。
https://tapcub.com/zh/tools/data-layer-generator
版本 v1.0更新于 更新记录
该用哪一段代码
几段代码描述的是同一个事件,按你的网站怎么装代码来选。
dataLayer.push + GTM
网站用 Google 跟踪代码管理器(GTM)时用它。页面只负责把数据推进数据层,发给哪些工具由 GTM 决定。电商事件放在 ecommerce 对象里,推之前先 { ecommerce: null } 清空,免得上一个事件的商品混进来。
gtag.js
网页里直接贴了 Google 代码、没用 GTM 时用它。事件名和参数一样,调用后立刻发送。
TapCub SDK 调用
同一个事件发给 TapCub。网页、小程序、App SDK 只收平铺的值,所以去掉了 items;服务端 SDK 保留一层对象数组,订单明细、支付都建议从服务端报。
检查结果
「错误」会让报表出问题(缺 transaction_id、有 value 没币种);「注意」值得看一眼(value 和商品合计对不上);「说明」解释会发生什么,比如自定义参数要注册自定义维度。
参数表里「是」表示 Google 文档列为必填;「条件必填」对应文档里的 Yes*:填了 value 就必须填 currency,value 本身是收入类报表要用的;「见说明」对应 No*:items 可以不填,但 refund 不带就没有商品级退款指标,select_promotion 不带就进不了「推广」报表。
从选事件到代码生效
大部分工作是选对事件,并让值来自你的页面,而不是这里的示例。
-
1
选事件
有合适的推荐事件就用推荐事件,GA4 的电商、线索报表认这些名字;没有就选「自定义事件」自己起名。
-
2
填参数
把示例值换成你的,或者先留着测试。注意看检查结果。
-
3
复制代码
把写死的值换成代码里的变量(订单号、金额、购物车明细),放在动作真正完成的位置。
-
4
配置并测试
照 GTM 步骤配好,用 Tag Assistant 和 GA4 的 DebugView 看事件;接的是 TapCub 就看实时数据。
检查依据的规则
GA4 规则都来自 Google 自己的页面(2026-11-10 核对):推荐事件参考、事件命名规则、收集上限。注意:Google 的服务在中国大陆网络下经常访问不了,面向国内用户的站点要另外准备统计方案。
- value 应等于各商品 price × quantity 之和,不含运费和税;currency 是 3 位 ISO 4217 代码,填了 value 就必须填。
- 每个商品至少要有 item_id 或 item_name;quantity 不填按 1。
- 事件名、参数名最多 40 个字符,参数值最多 100 个字符,都按网址编码后的长度算——中文一个字占 9 个,很快就超。每个事件最多 25 个参数。
- TapCub 这边,登记进事件目录的事件名是小写下划线、最多 40 个字符;网页脚本最多保留 20 个属性,小程序和 App SDK 30 个。
| 项目 | GA4 | TapCub |
|---|---|---|
| 事件名 | 40 个字符,字母开头 | 40 个字符,小写下划线 |
| 每个事件的参数 / 属性 | 25 个 | 网页 20 · 小程序 / App 30 · 服务端存 50 个 |
| 文本值 | 100 个字符 | 200(客户端 SDK)· 1,000(服务端) |
| 对象数组 | items,商品最多 27 个自定义参数 | 只有服务端(最多 100 个元素) |
| 保留前缀 | _ firebase_ ga_ google_ gtag.(参数) | $ _ tc_ |
一笔订单,三种写法
默认示例用的是 Google 文档里的 purchase 例子:两个商品,10.01 × 3 + 21.01 × 2 = 72.05,币种换成了人民币。
| 代码 | 事件名 | 订单号 | 金额 | 商品明细 |
|---|---|---|---|---|
| dataLayer / gtag | purchase | transaction_id | value 72.05 + 币种 | items 数组 |
| TapCub 网页 | purchase | order_id | revenue 72.05 + 币种 | 去掉(只收平铺值) |
| TapCub 服务端(Node.js) | purchase | order_id 和 insertId | revenue 72.05 + 币种 | 保留 items 数组 |
value 改成 revenue、transaction_id 改成 order_id,就是「按电商收入报表的默认属性名」这个选项。关掉它会保留 GA4 的名字,这时要到 TapCub 的经营设置里改映射。
数据层事件为什么丢了
代码很短,问题多出在时机和取值上。
没有先清空 ecommerce
不先 dataLayer.push({ ecommerce: null }),上一个事件的商品可能并进下一个事件——GTM 会把每次推送合并成一份数据层状态。
刷新页面就报一次支付
支付成功页每次加载都推 purchase,刷新一次就多一笔订单。一个订单只报一次;收入要准,就同时从服务端报。
数字被当成了文本
加了引号的 "72.05"、带千分位的 "1,299.00" 都是字符串,GA4 不会把它们加成收入。
自定义参数在报表里找不到
Google 列表之外的参数会被收集,但要注册成自定义维度或指标后才会出现在报表里。
不用代码管理器也能埋事件
TapCub 一个脚本就采集浏览和点击;要命名的事件一行调用,各端写法一致。
dataLayer(数据层)是什么?
页面上的一个 JavaScript 数组 window.dataLayer,页面把事件和值推进去,GTM 读它再决定触发哪些代码。这样页面不用关心接了几个统计工具。
怎么往 dataLayer 里推一个事件?
调用 dataLayer.push({ event: "sign_up", method: "Google" })。在 GTM 里建一个同名的「自定义事件」触发器来触发代码,其它键用「数据层变量」读出来。本工具把推送代码和配置步骤一起写好。
为什么要先推 { ecommerce: null }?
GTM 会把每次推送合并成一份数据层状态。先清空 ecommerce 对象,上一个事件的商品就不会混进下一个事件。这是 Google 电商文档里的写法。
dataLayer.push 和 gtag 有什么区别?
gtag 直接把事件发给 Google Analytics;dataLayer.push 只是记录在页面里,再由 GTM 发给 GA4 和其它代码。gtag 本身也是往同一个 dataLayer 数组里推数据。
GA4 哪些参数是必填的?
看事件:purchase 必须有 transaction_id 和 items,search 必须有 search_term;只要填了 value,currency 就必填。代码下方的参数表会列出当前事件的要求。
同一个事件能同时发给 GA4 和 TapCub 吗?
可以,事件名保持一致即可。TapCub 网页脚本只收平铺的值,订单明细从服务端报;电商收入报表默认读 revenue、currency、order_id,打开改名选项就会按这几个名字生成。
小程序埋点代码怎么写?
选「TapCub 小程序」,再选微信、支付宝或抖音,会生成 TapCub.track(事件名, 属性) 的调用;前提是 app.js 里已经按文档 preInit / init,并把采集域名加进小程序的 request 合法域名。
会上传我填的内容吗?
不会。代码在你的浏览器里生成,填的任何内容都不发送到任何地方。