> For the complete documentation index, see [llms.txt](https://developers-apps-in-toss.toss.im/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers-apps-in-toss.toss.im/documentation/api-and-sdk-zh/common/growth/analytics/toss-ads-pixel.md).
# Toss Ads 像素接入
如果你正在使用 Toss Ads，可以在 Apps in Toss 小程序中安装 Toss Pixel 来收集转化事件。基于收集到的数据，可以优化广告效果。
{% hint style="info" %}
**Toss Pixel 只能在 Web 环境中运行**
不支持 React Native 环境。
{% endhint %}
### 1. 获取转化追踪代码
请使用收到的账户登录 Toss 广告控制台。
请选择“广告工具 > 转化及追踪联动”菜单。
请创建转化追踪代码。转化追踪代码按广告账户单位发放。
请复制生成的转化追踪代码 ID。
### 2. 安装 Pixel 脚本
要使用 Pixel，请在 HTML 的 `` 区域中添加下面的脚本。
```html
```
### 3. 关联事件
需要在事件发生的时点调用 Pixel 事件，才能准确收集数据。
{% hint style="info" %}
**请使用一个转化追踪代码**
一个转化追踪代码即可管理所有事件。
{% endhint %}
| 分类 | 事件名 | 事件标签 |
| ---- | --------- | --------------- |
| 支付 | 支付商品详情页浏览 | PRODUCT\_VIEW |
| | 支付完成 | PURCHASE |
| | 首次购买完成 | FIRST\_PURCHASE |
| | 订阅完成 | SUBSCRIBE |
| 广告 | 应用内广告展示 | AD\_IMPRESSION |
| 登录 | Toss 登录完成 | SIGNIN |
| 页面浏览 | 转化引导页面浏览 | PAGE\_VIEW |
| 自定义 | 自定义事件 | - |
### 4. 按事件进行联动的方法
**支付**
如果使用应用内支付或 Toss Pay，就可以收集支付数据。
**支付商品详情页浏览(`PRODUCT_VIEW`)**
请在查看商品详情页的时点调用。
```html
```
**支付完成(`PURCHASE`)**
请在支付正常完成后立即调用。
```html
```
**首次购买完成(`FIRST_PURCHASE`)**
请在用户首次购买完成的时点调用。
```html
```
**订阅完成(`SUBSCRIBE`)**
请在订阅支付开始的时点调用。
```html
```
***
**广告**
**应用内广告展示(`AD_IMPRESSION`)**
请在广告展示的时点（例如： `show` 函数调用后立即）调用。
```html
```
***
**登录**
**Toss 登录完成(`SIGNIN`)**
请在 Toss 登录完成的时点调用。
```html
```
***
**页面浏览**
**转化引导页面浏览(`PAGE_VIEW`)**
请在访问特定页面的时点调用。适用于衡量与转化密切相关的页面。
```html
```
***
**自定义事件**
用于追踪不属于标准事件的转化。事件名称可以自由定义。
```html
```
***
**自定义属性**
所有事件（标准事件、自定义事件）都可以添加 custom\_param1 \~ custom\_param5。
用于传递难以用标准参数表示的附加信息。例如，可以包含活动区分值、促销代码、A/B 测试组、流量来源等。
```html
```
***
### 5. 测试
使用 Toss Pixel 助手，可以在本地环境中确认 Pixel 事件是否正常运行。
**安装 Toss Pixel 助手**
Toss Pixel 助手是一个 Chrome 扩展程序，可用于确认安装在网站上的 Toss Pixel 是否正常运行。
* 会自动检测安装了 Toss Pixel 的网站。
* 可以实时确认支付、广告、登录等事件是否被收集。
[Toss Pixel 助手 Chrome 扩展程序](https://chromewebstore.google.com/detail/toss-pixel-helper/kbbggbgnfmbpjpaieklnbbjfkjkkpcbi?utm_source=item-share-cb) 在页面中 **添加到 Chrome** 请点击按钮进行安装。
**在 Chrome 浏览器中确认**
1. 请使用以下命令运行项目。
{% tabs %}
{% tab title="npm" %}
```sh
npm run dev
```
{% endtab %}
{% tab title="yarn" %}
```sh
yarn dev
```
{% endtab %}
{% tab title="pnpm" %}
```sh
pnpm run dev
```
{% endtab %}
{% endtabs %}
2. 请在 Chrome 浏览器中访问本地服务。
`http://localhost:5173`
3. 请点击浏览器右上角的 Toss Pixel 助手图标。
4. 如果 Toss Pixel 已正常安装，会显示正在收集的事件列表（PURCHASE、PAGE\_VIEW 等）。你还可以一起确认事件是否已发送，以及是否包含参数（金額、ID 等）。
***
### 常见问题
如果 SDK 脚本加载失败，会影响小程序吗？
不会有影响。若 SDK 加载失败，只会忽略 TossPixel 的调用，不会影响小程序的正常运行。
在购买完成页面刷新后，事件会重复发送吗？
可能会重复发送。需要以订单 ID 为基准进行重复调用拦截处理。
不发送参数也可以吗？
可以。所有参数都是可选项。只调用方法也能正常收集。
不过，如果同时传递参数，可以更准确地分析广告效果。
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://developers-apps-in-toss.toss.im/documentation/api-and-sdk-zh/common/growth/analytics/toss-ads-pixel.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.