Web paywall

Before you begin, make sure you have the required Adapty SDK version installed:

  • Paywall Builder or custom paywalls: 3.6.1 or later (iOS), 3.15 or later (Android and cross-platform)
  • Flow Builder: 4.0 or later (all platforms)

With Adapty, you can create a paywall or flow with a button that redirects your app users to their browser for payment. Then, when they return to your app after a successful purchase, the subscription activates. This allows you to bypass store fees while tracking user payments.

Web paywall demo

The App Store allows external payment options only in the USA and Japan.

To use a paywall exclusively for these markets, duplicate your current paywall and set up a web paywall. This way, you will have two almost identical paywalls in use: one for the USA and Japan, and another for everybody else.

How it works

A web paywall is a unique URL generated for each of your in-app paywalls. It opens in the browser for payment and works with different payment providers (Stripe, Paddle, and others), supporting both a simple page with an Apple Pay button and more complex flows with additional offers.

Web paywall overview

Web paywalls work in the following way:

  1. Configure how the web paywall page will look and work in the web paywall editor.
  2. Link the web paywall in the paywall settings.
  3. In your app paywall, add a button redirecting users to the browser.
  4. Once users tap the button, Adapty SDK generates a unique URL.
  5. Users go to the web paywall page and pay for a subscription using an external payment method.
  6. When they return to the app, Adapty SDK polls for profile updates to confirm the subscription activated.
  7. Adapty records the purchase and monitors the subscription for status changes, such as renewals or cancellations.

Step 1. Create a web paywall

  1. Get a paywall to work with:
    • To enable external payments for an existing paywall, duplicate it. This lets you show the web paywall to your target segment and the original to everyone else.
    • To start from scratch, create a new paywall.
  2. On the Paywall page, switch to the Web paywall tab and click Create web paywall. You will be redirected to a new page.
Web paywall tab in paywall settings
  1. Set up the web paywall and connect a payment method.

For help setting up the external editor and connecting a payment provider, see the quickstart guide.

  1. Return to the Web paywall page and paste the paywall link.

When launching your paywall to the production environment, make sure you use the correct link generated after publishing your web paywall. The link format is paywalls-....fnlfx.com.

  1. Click Save.
Pasting the web paywall link and saving

Step 2. Trigger the paywall

To use your web paywall, you need to trigger it, and the way you do it depends on your setup:

  • If you are using the Flow builder, you only need to add a new button that will use the link you’ve provided to track purchases and send the data back to Adapty.
  • If you are using the SDK, you must set up the openWebPaywall method to handle web paywalls.

Step 2a. Add a web purchase button

If you are using the Flow Builder, you need to add a web paywall button. The button will use the link you’ve provided to track purchases and send the data back to Adapty.

  1. Open the flow and add a button.

    If you are using a template or an existing paywall, add a web paywall button alongside the existing purchase button. You can configure it the same way.

  2. In the Interactions panel on the right, click Add trigger. Then, assign the Purchase action to this trigger.

    on-tap-purchase.webp
  3. In the action settings, switch to the Web payment tab. There, select a product and—optionally—an offer to associate with the web purchase button.

  4. Paste the web paywall link to the Web paywall URL field.

  5. By default, web paywalls open in an in-app browser so that users don’t need to leave your app. If you want to open them in an external browser, select Open in external browser.

web-payment-action.webp

Step 2b. Call the SDK method

If you are working with a paywall you developed yourself, you need to handle web paywalls using the SDK method. Read the framework-specific guides:

Step 3. Set up a placement

Since the App Store only allows external payment options in the USA and Japan, create a separate user segment for iOS users in those markets and set up a placement to target different paywalls at different segments. For Android users, no geographic restriction applies — create a separate Android segment without a country filter.

  1. Create a new segment that will have the following attributes:
    • Country from store account: United States, Japan
    • Platform: iOS and iPadOS
    • App version: The latest one that uses the Adapty SDK.
Segment attributes for web paywall targeting
  1. Create a placement or edit an existing one. Add a new audience with the web paywall and the segment created.
Placement with web paywall audience