只需一行代码——其余一切按需添加
跟踪代码压缩后约 5 KB,可在任何网站上运行。针对事件、登录、电商和服务器端数据,我们提供精简的 JavaScript API 和服务器 API。
<script defer src="https://visualclicks.de/t/fwa.js" data-site="vc_…"></script>
事件、属性与登录
使用 fwa.track() 发送搜索、下载或点击等自定义事件,使用 fwa.set() 发送附加信息——可针对事件、页面、会话,或永久针对该用户。登录后,fwa.identify() 会将会话与您的客户编号关联。
每个新属性都会自动出现在属性注册表中,随后即可在筛选条件、卡片和细分中使用。
// 带属性的事件
fwa.track('search', { query: '帐篷', results: 12 });
// 适用于整个会话的属性
fwa.set('customer_type', 'vip', { scope: 'session' });
// 关联登录、退出登录
fwa.identify('cust_4711');
fwa.reset();
// 来自您 Cookie 横幅的同意
fwa.consent.grant(['analytics', 'recording']);
以事件呈现购买流程
电商 API 沿用 Google Analytics 4 的结构:商品浏览、购物车、结账、配送、支付、购买和退款,每个事件都包含商品、品牌、类别、价格和数量。
如果您的网店已有 GA4 数据模型,迁移所需的工作量很小。
fwa.ecommerce.viewItem({ item_id: 'ZT-100', item_name: '徒步帐篷',
item_brand: 'NordCamp', item_category: '帐篷', price: 249 });
fwa.ecommerce.addToCart({ item_id: 'ZT-100', price: 249, quantity: 1 });
fwa.ecommerce.beginCheckout(items, { value: 249 });
fwa.ecommerce.purchase(items, { transaction_id: 'A-1001',
value: 249, tax: 39.76, shipping: 0, currency: 'EUR' });
订单和 AI 爬虫数据直接来自您的服务器
使用设置中的服务器密钥,您的后端可直接向 VisualClicks 发送事件——不受浏览器、广告拦截器和同意状态的影响。订单通过订单号与浏览器数据合并。
AI 爬虫请求也以同样的方式报告,或者您可以上传“combined”格式的访问日志。
- 每个网站可设置多个密钥,并可逐个撤销
- 密钥仅显示一次,且仅以哈希形式存储
- 排除内部流量的 IP 规则
curl -X POST https://visualclicks.de/api/s/v1/events \
-H "Authorization: Bearer vcsk_…" \
-H "Content-Type: application/json" \
-d '{"source":"server","e":[{"t":"ecommerce","n":"purchase",
"u":"https://shop.example/thank-you",
"x":{"transaction_id":"A-1001","value":249}}]}'
异步加载
以 defer 方式加载,绝不阻塞页面
单页应用
自动记录通过 History API 进行的页面切换
无需编码
使用 data-fwa-event 跟踪点击
多个网站
每个网站拥有独立的代码和设置
常见问题
跟踪代码要添加在哪里?
添加在每个页面的 <head> 中——在大多数 CMS 和网店系统中,可通过主题或自定义脚本字段添加。代码以异步方式加载,不会阻塞页面。
它适用于单页应用(React、Vue、Next.js)吗?
适用。通过 History API 进行的页面切换会被自动记录为页面浏览。
如何无需编码即可跟踪按钮点击?
在元素上使用 data-fwa-event 属性,例如 data-fwa-event="newsletter_click"。可通过 data-fwa-prop-… 添加额外属性。
服务器密钥有什么用?
它让您的服务器可以直接发送事件:订单、退款或 AI 爬虫请求。服务器密钥绝不应出现在您网站的源代码中,并且可以逐个撤销。