Superwall: Remote Paywall Configuration on iOS

Events

At the top of the page is where you add your events. In this campaign, there’s already one there called campaign_trigger:

Later on, your app will register this event via the SDK. You can name an event almost anything you like.

Superwall automatically tracks events and some of these can present paywalls. Specifically:

• app_install: On configuration of the SDK for the first time.
• app_launch: On app launch from a cold start.
• session_start: On app open either from a cold start or after at least 30 seconds since the app left the foreground.
• deepLink_open: When opening a deep link in the app.
• transaction_fail: When a transaction fails.
• transaction_abandon: When a user abandons a transaction.
• paywall_decline: When a user declines a paywall.

Rules

Further down the page you’ll see a rule set to true:

As this is true, all users will match the rule. Click the rule to bring up the Rule Editor:

Using this, you can create more complex rules by filtering by user, device and event parameters provided via the SDK. You can also add a limit to how often they should match.

Rules get evaluated in order and once a user matches a rule, no other rules get evaluated. If a user doesn’t match a rule, they aren’t shown a paywall.

Here are some example rules you could use:

• if user.days_logged >= 3 then, show 6 times every 2 weeks.
• user.genre == "jazz" or user.genre == "classical"
• params.outcome contains "substring"

Paywalls

Underneath each rule is a group of paywalls. You’ll see one paywall assigned to 100% of users. In fact, that’s the example paywall that you saw earlier:

Underneath each paywall title is the amount of users currently assigned to that paywall. Paywalls assignments are sticky, which means users will always see the same paywall assigned to them for a given rule. An arrow appears next to it which you can click if you’d like to reset the assignment for those users:

If you wanted to, you could add multiple paywalls to this rule and assign each paywall to a certain percentage of users. If instead of 100% of users, you assigned only 50% of users to the paywall, the remaining 50% wouldn’t see a paywall, meaning they are in a holdout group. All these features make it possible to run A/B tests to determine the most effective paywall, which you’ll do later on.

This above is a very simple set up, however, advanced setups are possible. Check out the Superwall docs for more info.

You’ve now got a feel for how the dashboard works. The next step is to integrate the SDK into your app and trigger your first paywall!

Integrating the Superwall SDK

Adding the Superwall iOS SDK

To show the paywall in your app, you first need to add the Superwall iOS SDK called SuperwallKit to your project as a Swift Package.

In Xcode, select File ▸ Add Packages…, then paste the SuperwallKit package URL into the search bar.

https://github.com/superwall-me/Superwall-iOS

Set the Dependency Rule to Up To Next Major Version and specify 3.0.0 as the lower bound. Then, click Add Package:

Initializing the SDK

Next, you need to initialize the SDK when the app launches. Open AppMain.swift and add the following to the top of the file:

import SuperwallKit

Then, add the following to configure Superwall on init():

init() {
  Superwall.configure(apiKey: "YOUR_API_KEY")
}

Open the Superwall dashboard, click the Settings tab in the sidebar, select Keys and copy the Public API Key:

Back in AppMain.swift, replace YOUR_API_KEY with your Public API key.

Build and run your app. You won’t notice any visual changes. But if you head to the Superwall dashboard, you’ll notice the first two items checked off in the quickstart checklist. You’ve successfully configured the Superwall SDK:

Presenting the Paywall

The ideal place to show the paywall in your app is when the user presses the Get Inspired button. When that happens, you’ll need to register the event campaign_trigger.

At the heart of Superwall is register(event:params:handler:feature). This allows you to register an event to access a feature that may or may not be behind a paywall later in time. It also allows you to choose whether the user can access the feature even if they don’t make a purchase.

It takes the following parameters:

• event: The name of the event you wish to register.
• params: Optional parameters that you can refer to in your paywall and the rules you define in your campaign.
• handler: An optional handler whose functions provide status updates for a paywall.
• feature: An optional completion block containing a feature that you wish to put behind a paywall.

The calling of the feature block depends on whether the paywall is gated or non-gated:

Customizing Your Paywall

Adding Register to Your App

It’s recommended to register all core functionality in your app in order to remotely configure which features you want to gate without an app update.

Open WelcomeView.swift. In continueButton(), replace:

with:

That’s all you need!

Build and run your app. Tap the Get Inspired button and see your paywall presented!

Head to the dashboard and you’ll see the next few steps checked off in the onboarding list:

You now have working logic in your app to show a paywall. Unfortunately, it still very much looks like a template and the Purchase Primary button to purchase products doesn’t work!

Close the paywall by tapping the right button in the top right of the paywall. You’ll notice it navigates straight to your precious quotes after the paywall closes. That’s because the paywall is non-gated and therefore activates the feature block even though you haven’t paid. For your app, you need to make this gated. Ain’t nobody getting free quotes!

• Gated: Only calls the feature block if the user is already paying or if they begin paying.
• Non-Gated: Calls the feature block when the paywall dismisses regardless of whether they paid or not.Gating is remotely configurable in the paywall editor.

  path.append(Destination.motivationView)
  

  Superwall.shared.register(event: "campaign_trigger") {
    path.append(Destination.motivationView)
  }
  

path.append(Destination.motivationView)

Superwall.shared.register(event: "campaign_trigger") {
  path.append(Destination.motivationView)
}