Creating Subscription WordPress Form with free JetFormBuilder (Step-by-step)
The Subscription WordPress form is aimed to get more subscribers to your newsletter. In this tutorial, I’ll go through the form creation process using the free JetFormBuilder plugin.
JetFormBuilder plugin is the free WP form plugin for creating forms in Gutenberg editor. So, today I’ve decided to show you how to create a subscription form step-by-step.
In this tutorial, you’ll find lots of screenshots, and less text. 😁
For this tutorial you need:
➡WordPress
➡free JetFormBuilder plugin
➡free MailChimp account
How to Download the JetFormBuilder Plugin?
There are 3 ways to download this free WordPress form plugin:
- Go to the WordPress directory, download the plugin, and upload it to your WordPress dashboard:
2. Open your Plugins dashboard, and search for JetFormBuilder (you can also download JetStyleManager too, as we’ll need it for styling later):
3. Directly from jetformbuilder.com website:
Choose the comfortable way for you, and let’s get started.
JetFormBuilder Plugin Installation
To get started, I’ve installed JetFormBuilder from my WordPress plugins dashboard (using search), then pressed Activate:
After this, you’ll find the plugin section in the left menu, and in the Installed Plugins:
WordPress Subscription Form Guide
#1 Create New WordPress Form
#2 Choose subscription form pattern (template)
#3 Edit fields (if needed)
I’ve deleted the image, edited the text:
#4 Style your form
With the free JetStyleManager plugin (I’ve uploaded and activated the plugin earlier), you can edit your form as needed. But I’ll change only the color of the “subscribe to new blog posts” text.
#5 Setup post submit action
I want to receive all subscriptions to my MailChimp dashboard, that’s why I’ll use MailChimp post submit action.
For this, go to post submit actions, add a new one, and choose the Edit button:
In the Edit tab, I’ve passed my API key from MailChimp and chose the audience list:
After choosing the audience list, I need to map my fields (Name with name, email with email):
And press the Update button.
Publish the form to save all settings, and let’s add the form to the page.
#6 Add the subscription form to the Gutenberg page
There are 2 ways to add the created WordPress form:
- Via Shortcode: copy the shortcode in the Forms dashboard and pass it to your page.
2. Go to your page, press Plus icon, and search for JetForm block:
Then choose the needed form (in my case, this is the subscription form):
And we are done, my subscription form is ready:
Where Do My Form Subscribers Lay?
So, after creating the form, let’s test to see how does it work:
After pressing Subscribe button, you’ll see the message — Form Successfully submitted (you can edit it also).
And my subscription successfully goes to my free MailChimp account:
Voila!😊
Sum Up
Hope this easy and quick WordPress subscription form tutorial was helpful for you. Don’t hesitate to share what would you like to see next in the comments below.⬇
💪Helpful resources used in this tutorial:
