Web 付费墙

开始之前,请确保您已安装适用于 iOS 的 Adapty SDK 3.6.1 或更高版本,或适用于 Android 的 Adapty SDK 3.15 或更高版本。

通过 Adapty,您可以创建一个带有按钮的付费墙,将应用用户重定向到浏览器进行付款。当用户成功购买后返回应用时,订阅将自动激活。 这使您能够绕过应用商店手续费,同时有效追踪用户付款情况。

web_paywall.gif

App Store 仅在美国允许使用外部支付选项。

如果您想仅面向美国市场使用付费墙,请复制您当前的付费墙并设置一个 Web 付费墙。这样,您将同时使用两个几乎相同的付费墙:一个用于美国/日本,另一个用于其他所有地区。

工作原理

Web 付费墙是您每个应用内付费墙的唯一 URL,允许用户跳转到浏览器并在那里完成付款。它支持不同的支付提供商(Stripe、Paddle 等),并允许您创建带有 Apple Pay 按钮的单页面,或包含追加销售的更复杂流程。

web-paywall-promo.png

Web 付费墙的工作方式如下:

  1. 您在编辑器中配置 Web 付费墙页面的外观和功能。
  2. 您在付费墙设置中关联 Web 付费墙
  3. 在应用付费墙中,您添加一个按钮,将用户重定向到浏览器。
  4. 用户点击按钮后,Adapty SDK 生成唯一 URL
  5. 用户进入 Web 付费墙页面,并使用外部支付方式完成订阅付款
  6. 当用户返回应用时,Adapty SDK 开始追踪用户画像是否因购买而更新
  7. Adapty 获取购买事件信息,将其记录为分析事件,并持续监控更新。

第一步:创建 Web 付费墙

  1. 如果您想为现有付费墙启用外部支付,需要先复制该付费墙,以便仅向美国用户细分展示,并向其他所有用户展示旧版付费墙。如果您想从头开始,请创建一个新的付费墙。
  2. 在付费墙中,切换到 Web paywall 标签页,然后点击 Create web paywall。您将被重定向到一个新页面。
    web-paywall-1.png
  3. 设置 Web 付费墙本身并连接支付方式。

使用我们的快速入门指南,帮助您快速启动一个可用的 Web 付费墙。

  1. 返回 Web paywall 页面并粘贴付费墙链接。

将付费墙发布到生产环境时,务必确保使用发布 Web 付费墙后生成的正确链接。链接格式为 paywalls-....fnlfx.com

  1. 点击 Save
    web-paywall-4.png

第二步:触发付费墙

要使用您的 Web 付费墙,需要触发它,具体方式取决于您的设置:

  • 如果您使用的是在编辑工具中创建的付费墙,只需添加一个新按钮,该按钮将使用您提供的链接追踪购买并将数据发送回 Adapty。
  • 如果您使用的是 SDK,则必须设置 openWebPaywall 方法来处理 Web 付费墙。

第 2a 步:添加 Web 购买按钮

如果您使用的是付费墙编辑工具中创建的付费墙,需要添加一个 Web 付费墙按钮。该按钮将使用您提供的链接追踪购买并将数据发送回 Adapty。

  1. 打开付费墙并切换到 Builder & Generator 标签页。

  2. 点击 Add element 并选择 Web paywall button

    如果您使用的是模板或现有/复制的付费墙,请将刚刚添加的 Web 付费墙按钮添加到之前的购买按钮旁边。 您可以像设置购买按钮一样设置 Web 付费墙按钮。

  3. Open paywall in 下拉菜单中选择打开 Web 付费墙的方式:

    • External browser:在默认浏览器应用中打开付费墙。
    • In-app browser:在应用内浏览器中打开付费墙,无需离开应用。
web-paywall-5.png

第 2b 步:调用 SDK 方法

如果您使用的是自己开发的付费墙,需要通过 SDK 方法处理 Web 付费墙。请参阅对应框架的指南:

第三步:设置版位

由于 Web 付费墙仅允许在美国的 iOS 应用中使用,请为美国/日本添加单独的用户细分,并设置版位以向不同细分展示不同的付费墙:

  1. 创建新的市场细分,包含以下属性:
    • Country from store account:United States
    • Platform:iOS and iPadOS
    • App version:使用 SDK 3.6.0 或更高版本的最新版本。
      web-paywall-6.png
  2. 创建版位或编辑现有版位。添加新的目标受众,关联 Web 付费墙和已创建的市场细分。
    web-paywall-7.png