Previewing a Paywall

It is recommended to preview your paywall in different screen sizes before you push it into production. To do this, you should use either Chrome Developer Tools or Safari's Responsive Design Mode.

Chrome Developer Tools

Open your paywall webpage in Google Chrome and select View ▸ Developer ▸ Developer tools:


Then, toggle the device toolbar by selecting the device icon in the menu that appears on the right:


This will resize your webpage into a mobile preview window. Toggle between the different mobile devices testing the design for the different device types supported by your application:


Safari's Responsive Design Mode

If you use Safari, open your paywall webpage and go to Develop ▸ Enter Responsive Design Mode:


From there you can adjust the page size and resolution by selecting different device types:


In-App Preview

To preview your paywall on device, see In-App Paywall Previews.