广告像素

/

2 分钟阅读

在网站中添加 Zalify Pixel

通过脚本安装 Zalify Pixel,保留预加载队列,避免单页应用加载期间的调用丢失。

通用安装方式是在网站的 <head> 中加入两个 <script> 标签。Shopify 店铺请使用Shopify 安装方式,其中会自动处理平台授权状态。

开始前

从 Zalify 控制台获取工作区 ID(wid)。如果还不熟悉像素用途,先阅读Zalify Pixel 的作用。

安装步骤

1

复制代码

第一段脚本建立调用队列,第二段加载像素:

<script>
  window.zalify = window.zalify || function(){(zalify.q=zalify.q||[]).push(arguments)};
</script>
<script src="https://cdn.zalify.com/pixel.js?wid=YOUR_WORKSPACE_ID" defer></script>
2

替换工作区 ID

将 YOUR_WORKSPACE_ID 替换为控制台中的 wid。

3

加入网站 head

在需要追踪的页面 <head> 中放入代码。通常添加到共用布局或模板,即可全站加载。

4

发布并刷新

部署后打开网站。像素启动、获取工作区配置,并自动记录页面浏览。

保留预加载队列

单页应用应保留第一段 window.zalify 队列代码。它会暂存 pixel.js 加载完成前的调用,避免页面 hydration 期间的事件丢失。不要只加载第二段脚本。

单页应用与框架

像素会自动追踪路由变化,无需在 SPA 内部导航时另发页面浏览事件。可用于 Next.js、Remix、Vue、Svelte 和 Astro。

App Router 与 Pages Router 的具体方式见 Next.js 集成指南。

验证安装

通过预览模式实时观察事件。

下一步