In this article, we will cover how to automatically get information about price, duration, and trial days from Stripe to display on your paywall.
Log in to Onboarding Online and either create a new project or open an existing one.
Ensure Stripe is connected to your project by following the Stripe integration process.
Add your Stripe products (subscriptions or one-time purchases) to the project.
Open the onboarding sequence where you want to integrate the Stripe product information.
Add a paywall screen to your onboarding sequence, or click on the edit icon to open the Edit screen.
On the paywall edit screen, add the Stripe products you want to display.
7. Use Text Tags to Display Stripe Information
You can add text tags in the labels on the paywall to display information fetched from Stripe. The following tags are available:
@price
: Just the price value.@priceAndCurrency
: Price value with the currency sign.@duration
: Just the duration value, without months/days suffix.@interval
: Duration with the suffix (months/days).@trialDays
: Just the number of trial days.@fullTrialDays
: Number of trial days with "Day(s)" suffix.@introPrice
: Introductory price text from Stripe.@introProduct
: Introductory product text from Stripe.@introDuration
: Usage duration text from Stripe.
8. Save and Close
After adding the text tags, click on Save and Close to apply the changes.
Click on Web Link in the top panel.
Set up your Web2App and click on Create to generate the link, or Update if you are modifying an existing setup.
Open the generated link in the browser to see the information from Stripe displayed as per the tags you used.
Examples of Usage:
Let's walk through an example where we have created a product for $10 that recurs every 3 months, with a 3-day free trial.
We have added the product to the paywall products and have added 3 days Free trial for it:
We will add this product to the paywall and use text tags to display information dynamically:
Created Web link and opened in in browser: