How to create a paywall
In this example, we'll create a non-dismissible paywall overlay prompting users to upgrade to use premium features by starting a free trial!
To begin with, you'll need to...
Create your content as an Overlay:
We want to make our overlay non-dismissible, and we don't want to hide the backdrop
ℹ️ Selecting Hide Backdrop allows users to keep the overlay open while interacting with the screen behind. The only way to dismiss an overlay with Hide Backdrop selected is via the dismissible 'X' or a button set to dismiss the overlay ✨Drag on your content as usual and customize the copy! Here, we'd want an image, a layout underneath for your typography, three layouts nested in that parent layout (set to row with an image and typography), and a layout underneath for your CTA buttons.
Now, let's customize the overlay itself! We want to remove the padding around the overlay, and we don't want there to be a radius or border on it:
✨ Top tip ✨ Click on the icon next to Padding to change all four simultaneously! Click again if you want to make a change to any of them individually.
There you have it! You've created your paywall overlay 🎉
Would you be ready to launch your masterpiece? Here's our article on how to launch your overlay! 🚀