1 创建像素并记录 ID
在 NEWSBREAK 广告后台打开 Tools → Event management → Create/test web event。
选择 Pixel 和 Custom code；取消 Add to Wishlist，保留其余 6 个事件，并开启 Event value。
从初始化代码中复制自己的 Pixel ID。
截图中的 ID 只是示例。两段代码都要换成自己的 ID，并保留 ID- 前缀。
2 安装主题基础代码
进入 Shopify 主题代码编辑器，打开 layout/theme.liquid，在 <head> 内、<title> 前插入代码，替换 NB_ID 后保存。按标签定位，无需照搬截图行号。
主题基础代码：填入 ID 后直接复制
填入 ID 后，代码自动替换，即可直接复制。
<script type="text/javascript">
// =========================//
// Newsbreak v1.3
// ***************************//
const NB_ID = 'ID-XXXXXXXXXXXXXXXXXXX';
// ===================
// DO NOT UPDATE BELOW
// ===================
!(function (e, n, t, i, p, a, s) {
e[i] ||
(((p = e[i] =
function () {
p.process ? p.process.apply(p, arguments) : p.queue.push(arguments);
}).queue = []),
(p.t = +new Date()),
((a = n.createElement(t)).async = 1),
(a.src = 'https://static.newsbreak.com/business/tracking/nbpixel.js?t=' + 864e5 * Math.ceil(new Date() / 864e5)),
(s = n.getElementsByTagName(t)[0]).parentNode.insertBefore(a, s));
})(window, document, 'script', 'nbpix'),
nbpix("init", NB_ID.trim()),
nbpix('event', 'pageload');
(async () => {
//save cid params to localstorage
var url = new URL(window.location.href);
var c_id = url.searchParams.get('newsbreak_cid');
if (c_id) {
localStorage.setItem('_newsbreak_click_id', c_id);
}
})()
// =========================//
// Newsbreak end
// ***************************//
</script>3 添加 Shopify 客户事件
进入 设置 → 客户事件 → 添加自定义像素，命名为 NB。
粘贴下面的客户事件代码，替换 NB_ID，保存并点击 连接。
客户事件代码：参考原版，填入 ID 后直接复制
填入 ID 后，代码自动替换，即可直接复制。
// =========================//
// Newsbreak v1.3
// ***************************//
const NB_ID = 'ID-XXXXXXXXXXXXXXXXXXX';
// ===================
// DO NOT UPDATE BELOW
// ===================
!(function (e, n, t, i, p, a, s) {
e[i] ||
(((p = e[i] =
function () {
p.process ? p.process.apply(p, arguments) : p.queue.push(arguments);
}).queue = []),
(p.t = +new Date()),
((a = n.createElement(t)).async = 1),
(a.src = 'https://static.newsbreak.com/business/tracking/nbpixel.js?t=' + 864e5 * Math.ceil(new Date() / 864e5)),
(s = n.getElementsByTagName(t)[0]).parentNode.insertBefore(a, s));
})(window, document, 'script', 'nbpix'),
nbpix('init', NB_ID.trim()),
analytics.subscribe("checkout_completed", event => {
nbpix('event', 'complete_payment', {nb_value: event.data.checkout.totalPrice.amount});
});
analytics.subscribe("payment_info_submitted", event => {
nbpix('event', 'add_payment_info', {nb_value: event.data.checkout.totalPrice.amount});
});
analytics.subscribe("product_added_to_cart", event => {
nbpix('event', 'add_to_cart', {nb_value: event.data.cartLine.cost.totalAmount.amount});
});
analytics.subscribe("checkout_started", event => {
nbpix('event', 'initiate_checkout', {nb_value: event.data.checkout.totalPrice.amount});
});
analytics.subscribe("product_viewed", event => {
nbpix('event', 'view_content', {nb_value: event.data.productVariant.price.amount});
});
analytics.subscribe("search_submitted", event => {
nbpix('event', 'search');
});
// =========================//
// Newsbreak end
// ***************************//4 在域名应用中填写 ID
进入应用的像素设置，找到 NewsBreak Pixel ID(s)，填写同一个 ID 的数字部分，不带 ID-。勾选 Enable Postback API 后保存。
5 测试结账与事件
① 打开测试入口。进入域名应用的 Funnels，点击 One Page Checkout 右侧的 … → Preview Funnel。
② 选择测试商品。在商品选择窗口中勾选商品及规格，点击 Add。确认规格和数量，再点击 Next。
③ 进入沙盒结账。选择 Preview with Checkout page，点击 Preview。也可以复制上方的 Direct Preview URL 在新窗口打开。
这里使用沙盒支付，不会生成 Shopify 订单。测试卡号：4111 1111 1111 1111；有效期填未来日期，CVV 填任意 3 位数字。
④ 填写测试信息并支付。填写邮箱、姓名、地址和电话。图中使用美国测试信息：Demo Tester / 123 Test Street / New York / NY / 10001，电话 2025550100。
选择 Credit card，填入测试卡。有效期示例 12/30，CVV 示例 123，持卡人姓名 Demo Tester，然后点击 Pay now。
⑤ 测试 Upsell 并到达完成页。如果出现 Upsell 页面，可以点击 Confirm purchase 测试加购；也可以点击 No thanks, I don't want this offer 跳过加购，继续到完成页。
看到 Confirmation #TestOrder 和 Your order is confirmed，即完成沙盒测试下单。
返回 NEWSBREAK 事件管理查看事件是否收到。平台测试链接与事件检查操作见第 6 步。
6 测试链接并验证事件
- 选择店铺内任意商品的广告着陆页链接，填入 Test URL。
- 点击右下角的 Copy test link，复制测试链接，粘贴到新窗口的地址栏并打开。
- 在测试页面中，依次点击 Add to cart 和 PAY WITH DEBIT/CREDIT CARD。
- 返回 NEWSBREAK 广告平台，查看图 2 红框中的代码是否生效。
确认红框中的代码生效后，保存事件即可。