Using Gravity Forms to Build a Simple Paywall Solution

A Paywall is used to prevent access to some kind of content, i.e blog post, ebook, download, membership site, until your customer completes a purchase.

In this article I will be walking you through how to setup a simple paywall solution using Gravity Forms and Stripe.

Prerequisites

• Gravity Forms Pro License (at minimum)
• Popup Maker Plugin
• Stipe.com Account (or PayPal)

If you only have a Basic license from Gravity Forms, you can upgrade following the instruction here. Pro will provide you with the Stripe and PayPal Add-Ons you will need to handle the money part.

Installing the Required Plugins

This video will walk your through installing Gravity Forms.

If you need help installing the Popup Maker Plugin, here is a quick video to walk you through that process.

Setting Up the Stripe Add-On

I think it is important that you understand why I prefer Stripe over the PayPal Standard Add-On. With Stripe the credit card processing happens in real time from your website through the form.

With PayPal, the user is redirected to PayPal to complete their purchase then redirected back to your site.

There are less complications when using Stripe and no risk of the user getting access to the product without completing a successful payment.

If you need help setting up the Stripe Add-On, pleaser refer to the step-by-step tutorial here, or feel free to checkout the walkthrough video here.

Building Your Form

I prefer for this form to be simple, low friction, so I will only be using a couple fields. You can however, add whatever fields you’d like to your form.

The Fields

• Name
• Email
• Product
• Stripe Card

In my demo, the Product field is hidden, so that I can setup and style the call to action the way I want, without dealing with the form pricing field.

The Delivery

In my demo, I’ll be providing a downloadable file after the purchase is completed.

For simplicity, I will simply use the confirmation message, displayed after the form is submitted to deliver the download.

Setting Up the Form

This video will walk your through the whole form building process.

Building the Popup Box

You do not have to use a popup box when setting up this paywall. You can just embed your form directly onto your page, but I wanted something that I could use within my blog content that looked nice and didn’t confuse people, like a form in the middle of a blog article might do.

Why the Popup Maker Plugin?

This is important. There are a lot of popup or modal plugins in the market place, and some that are built into page builders like Elementor, however these can often be problematic causing conflicts with the Gravity Forms plugin.

The only popup plugin that is suggested for use (not endorsed or supported by) by Gravity Forms support is Popup Maker.

The Setup – Part 1

1. Go to Popup Maker > Create Popup
2. Enter your Title
3. Add whatever content you want in the popup
4. Click Add Form
5. Select the form from the dropdown
6. Uncheck Title, Description
7. Check Enable AJAX
8. Click Insert Form

The Setup – Part 2

1. Scroll down to Popup Settings
2. Click Add New Trigger
3. Select Click Open from the dropdown
4. Uncheck “Prevent popup from showing…”
5. Click Add
6. Enter a CSS Class .paywall-go
7. Click Add
8. Go to Display
9. Click Center Popup
10. Go to Appearance
11. Select your desired theme from the dropdown
12. Click Publish

Creating Your Call to Action

You can use this in a sales page, blog post, sidebar, etc… and you can make it as simple or as fancy as you’d like. For this demonstration, I will be building a reusable block that can be easily inserted into my blog articles.

After creating your form, the popup, and your call to action, you can start using your paywall.

Below is a demo of my paywall in action.

The Wrap Up

There are a number of ways to use a paywall, and there are a number of solutions you could use to accomplish this task, however, Gravity Forms is a great option.

If you have questions or need help building your paywall, please use the comments below.