> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 激活并配置 Rokt Thanks

> 如何在确认页面上启用和设计 Rokt Thanks

要通过感谢页面（Thank You 页面）、订单状态页面和客户账户页面上的 Rokt Thanks 获得额外收入，你必须先在 Aftersell 管理后台中设置并启用 Rokt Thanks。操作步骤如下：

在导航菜单中进入 *Rokt Thanks* 标签页。

点击"Get Started"（开始）

在 **Your store**（你的商店）步骤中，从 **Your industry**（你的行业）下拉菜单中选择你的行业，然后从 **Your products/services**（你的产品/服务）中选择对应的子类别。两者都是必填项——在两项都设置完成之前，**Save & Continue**（保存并继续）按钮将保持禁用状态，并且只有在选择了行业之后，第二个下拉菜单才可选择。如果没有找到完全匹配的行业或子类别，请选择最接近的选项。

点击"Save & Continue"（保存并继续）进入下一步。此设置向导中没有单独的同意勾选框——Rokt Thanks 已包含在你首次设置 Aftersell 时接受的条款中。如需参考，请查看我们的[条款和条件](https://www.rokt.com/policies/aftersell-powered-by-rokt-services-agreement)和[隐私政策](https://www.rokt.com/policies/privacy-policy)。

要通过 Rokt Thanks 广告获得付款，你需要提供一个 PayPal 邮箱地址。如果你没有 PayPal 账户，仍然可以输入你希望用于接收付款的邮箱地址，在你的第一笔付款处理完成后，PayPal 会帮助你创建账户。点击[此处](/zh/aftersell/rokt_thanks_payouts)了解更多关于付款的信息。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-payouts-step-paypal-email.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=58c61ba46c6749df18c79f1e324da612" alt="Rokt Thanks 付款设置步骤，显示 PayPal 邮箱字段" width="774" height="478" data-path="images/aftersell/rokt-thanks-setup-payouts-step-paypal-email.png" />
</Frame>

之后，应用会显示一个加载画面，此时我们正在创建你的 Rokt 账户并为你开通 Rokt Thanks 功能。这**不会**立即在你的商店中启用 Rokt Thanks。

账户创建完成后，在设置引导中点击"Enable"（启用）按钮以启用 Rokt Thanks。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-checklist-enable-button.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=4992cab4cafebde190ce4a9e76e5dd5e" alt="Rokt Thanks 设置清单，突出显示 Enable 按钮" width="1190" height="480" data-path="images/aftersell/rokt-thanks-setup-checklist-enable-button.png" />
</Frame>

**下一步：** 我们将把广告放置到你的商店中。

<div id="app-block-placement">
  ## **应用区块放置**
</div>

Rokt Thanks 基于 Shopify 的 Checkout Extensibility 框架构建，需要在 Shopify 页面上放置应用区块才能进行渲染。我们用于 Rokt Network 产品的应用区块名为"Rokt Thanks"区块。

要将此区块放置到你的感谢页面和订单状态页面，只需在 Rokt Thanks 管理后台中点击"Edit Thank you page"（编辑感谢页面）和"Edit Order status page"（编辑订单状态页面）按钮，即可跳转到 Shopify Checkout Editor。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-onboarding-block-placement.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=b3b527e914d4df7c78666ffd34198865" alt="Shopify checkout 编辑器中正在添加 Rokt Thanks 应用区块" width="1198" height="494" data-path="images/aftersell/rokt-thanks-setup-onboarding-block-placement.png" />
</Frame>

进入后，在页面上的任意版块中点击"Add block"（添加区块），并从 Aftersell 区块列表中选择"Rokt Thanks"。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-checkout-editor-add-block.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=2d3faa4b743f0fa01cfafb4d0b58164f" alt="Shopify checkout 编辑器的 Add block 面板，从 Aftersell 区块中选中 Rokt Thanks" width="802" height="812" data-path="images/aftersell/rokt-thanks-setup-checkout-editor-add-block.png" />
</Frame>

放置完成后，请务必点击"Save"（保存）。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-save-button-checkout-editor.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=516979f3c1065786e61ec128fc7bea7e" alt="Shopify checkout 编辑器工具栏中突出显示的 Save 按钮" width="332" height="96" data-path="images/aftersell/rokt-thanks-setup-save-button-checkout-editor.png" />
</Frame>

当你返回 Rokt Thanks 管理后台时，我们会自动检测区块放置情况，你的任务清单也会随之更新。请注意，在 Shopify Checkout Editor 中成功保存应用区块之前，设置将一直显示为未完成状态。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-checklist-thank-you-order.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=86ec58632fbfd0787f8b202fbb3b4bec" alt="Rokt Thanks 设置清单，显示感谢页面和订单状态页面的区块已放置" width="1200" height="494" data-path="images/aftersell/rokt-thanks-setup-checklist-thank-you-order.png" />
</Frame>

***

<div id="rokt-vaulted-rewards-customer-account-pages">
  ## **Rokt Vaulted Rewards（客户账户页面）**
</div>

**概述**

Shopify 推出了新一代客户账户页面——特别是 Profile（个人资料）和 Orders（订单）页面——支持应用区块。如果你的商店已迁移到这些新账户页面，你现在可以在这些位置展示 Rokt Thanks 广告，展示方式与感谢页面上的广告相同。

这是一个可观的增量收入机会，预计可在现有广告位的基础上带来 10-20% 的提升。

**要求**

你的商店必须使用 Shopify 的新版客户账户页面。你可以通过检查登录体验来确认：

点击店面导航栏中的"My Account"（我的账户）按钮。如果登录页面显示带有醒目紫色/靛蓝色的"Continue with Shop"（使用 Shop 继续）按钮，并使用 Shop Pay 身份验证，**则说明你的商店正在使用新版账户页面，符合此广告位的条件。**

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-continue-with-shop-signin.gif?s=d98614a0e9ecf818583f3fe10de0cec9" alt="店面登录页面，显示紫色的 Continue with Shop 按钮和更多登录选项" width="1112" height="1080" data-path="images/aftersell/rokt-thanks-setup-continue-with-shop-signin.gif" />
</Frame>

登录后的视图：

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-logged-in-account-view.gif?s=b17d297a3fa206c8cdb091432f61b74d" alt="使用 Shop 登录后的客户账户视图" width="2072" height="1080" data-path="images/aftersell/rokt-thanks-setup-logged-in-account-view.gif" />
</Frame>

**步骤 1：完成设置**

Aftersell 的"Rokt Thanks"标签页中将出现一张新卡片。点击"Start setup"（开始设置）后会出现加载动画。加载期间，你的账户中将创建两个新页面——一个用于 Orders，一个用于 Profile——所有依赖项都会自动附加。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-start-setup-card.gif?s=d0d20f282383765853f75f81d72fcfb9" alt="Rokt Thanks 标签页上的 Start Setup 卡片，正在创建新的 Orders 和 Profile 页面" width="3840" height="684" data-path="images/aftersell/rokt-thanks-setup-start-setup-card.gif" />
</Frame>

**步骤 2：授予数据访问权限**

Rokt 需要特定的访问权限才能在你的账户页面上展示。此步骤没有单独的按钮——页面创建完成后，**Start setup** 会立即为你请求 `customer_read_customers` 和 `customer_read_orders` 权限，Shopify 会弹出"Update data access"（更新数据访问）提示。批准该提示即可继续。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-update-data-access-prompt.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=629d64e46c019bb7b8d304c68895e359" alt="Shopify Update data access 提示，列出 Aftersell 请求的客户和商店数据权限" width="770" height="636" data-path="images/aftersell/rokt-thanks-setup-update-data-access-prompt.png" />
</Frame>

**步骤 3：放置应用区块**

授权完成后，点击"Edit Orders page"（编辑订单页面）打开 Shopify 编辑器。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-checklist-edit-orders-page.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=24b7586f764e0018296f4f5ad0a0ccc3" alt="Rokt Thanks 设置清单显示五项任务已完成四项，突出显示 Edit Orders Page 按钮" width="1212" height="480" data-path="images/aftersell/rokt-thanks-setup-checklist-edit-orders-page.png" />
</Frame>

我们需要将"Rokt Thanks"应用区块添加到 Profile 和 Orders \*\*<u>两个</u>\*\*页面上。因此，请在两个页面上分别重复以下步骤。

首先，在 Shopify 编辑器顶部的下拉菜单中选择页面。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-editor-selector-dropdown-open.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=67548d607e4ffbd12396029c60393a1e" alt="Shopify 编辑器页面选择下拉菜单已展开，突出显示 Orders 和 Profile 账户页面" width="726" height="618" data-path="images/aftersell/rokt-thanks-setup-editor-selector-dropdown-open.png" />
</Frame>

点击"Add Block"（添加区块）并选择"Rokt Thanks"。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-editor-add-block-panel.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=9bbb9077b12d4d689be41d6d8dd93b42" alt="Shopify 编辑器的 Add block 面板，突出显示 Aftersell Rokt Thanks 区块" width="804" height="574" data-path="images/aftersell/rokt-thanks-setup-editor-add-block-panel.png" />
</Frame>

放置完成后，请务必点击"Save"（保存）。然后在另一个页面上重复相同的步骤。

<Warning>
  设置向导只跟踪 **Orders** 页面的区块。只要该区块放置完成，此步骤就会显示为已完成，即使 Profile 区块仍未放置——因此在确认设置完成之前，请自行检查 Profile 页面。
</Warning>

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-save-button-checkout-editor.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=516979f3c1065786e61ec128fc7bea7e" alt="Shopify checkout 编辑器工具栏中突出显示的 Save 按钮" width="332" height="96" data-path="images/aftersell/rokt-thanks-setup-save-button-checkout-editor.png" />
</Frame>

就是这样——Rokt Thanks 现在已在你的账户页面上上线。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-live-offer-hellofresh-free.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=6f996d228e45c38312bac4f9a317bf73" alt="HelloFresh 免费餐食的 Rokt Thanks 实际广告示例，带有 Claim 和 Decline 按钮" width="810" height="284" data-path="images/aftersell/rokt-thanks-setup-live-offer-hellofresh-free.png" />
</Frame>

<Note>
  Vaulted rewards 仅适用于使用 Shopify 新版客户账户的商店。如果你在 Rokt Thanks 管理后台中没有看到 vaulted rewards 选项，说明你的商店可能暂时不符合条件。
</Note>

***

<div id="appearance">
  ## **外观**
</div>

在 Shopify 的 Extensibility 框架中，你可以使用一些外观选项。这些自定义选项由 Shopify 在其 Checkout Editor 中控制。你可以通过 Shopify 的 Settings > Checkout > Customize 访问 Checkout Editor。

Rokt Thanks 将专门继承你为 checkout 页面选择的字体排版，以及 Color（颜色）部分中指定的 Button（按钮）和 Accent（强调）颜色。

<Frame>
  <img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/rokt-thanks-setup-checkout-editor-styling-inherit.png?fit=max&auto=format&n=SnVX3h-PpMMxQMDU&q=85&s=706aea4810c473bd0e058db0bf29de19" alt="Shopify Checkout Editor 的强调色、按钮和字体设置，标注显示 Rokt Thanks 广告继承这些设置" width="1490" height="806" data-path="images/aftersell/rokt-thanks-setup-checkout-editor-styling-inherit.png" />
</Frame>

***

<div id="preview-the-placement">
  ## **预览广告位**
</div>

要在实际页面上查看广告位，请按照以下步骤操作：

1. 在 Aftersell 管理后台中启用 Rokt Thanks
2. 确保已通过 Shopify Checkout Editor 将"Rokt Thanks"应用区块放置在感谢页面、订单状态页面以及（如符合条件）客户账户页面上
3. 启用广告位后请等待 10 分钟，再进行测试购买
4. 在你的商店中进行测试购买并查看相关页面

如果 Rokt Thanks 未按预期显示，请点击下方按钮了解更多信息：

[了解更多](/zh/aftersell/why_is_rokt_thanks_not_showing_on_my_confirmation_page)
