While forms are the most basic and the easiest way to collect data and user information, it can come across as boring or tedious. So what can you do to avoid that? Splitting and dividing simple forms into multiple parts has more benefits than one can think of. For one, it makes a simple form more interesting and appealing to the users who are filing them out. Another benefit is the engagement you get from your users which surely affects the site in a positive way. Instead of monotonous and lengthy forms, one can keep things short and interesting by diving it into various sections or pages i.e a multi step form.
And that is exactly what we will be talking about today! Creating a multi step form on WordPress. While there are tons of plugins and their add-ons that are dedicated to the purpose, the one we will be using today is Everest Forms by WPEverest. The process might seem daunting but thanks to this amazing plugin, it takes just a simple few clicks and you are done in no time.
But before we actually start with the tutorial, here is a brief intro into the plugin Everest Forms and the major reasons why we chose to use it for our post today!
A WordPress form plugin, Everest Forms has made the form building experience great for WordPress users all over the world. Created especially to cater to the needs of professional business and personal, anything form-related is possible with Everest Forms. Whether you want to create contact forms, registration forms or anything else to make the process of collecting data easier, this is the ideal start.
Why? Well, the amazingly user-friendly UI is a start. It is extremely easy to use, customize and display forms with just a few clicks! Another highlight of this plugin is the amazing add-ons that extend the features of the form builder even more. In fact, we too will be using the help of the plugin: Multi Part Forms on our post today. Now without further ado, let’s get started!
Because this post is dedicated to both the experts and the beginners, we will guide you through the step-by-step process of creating a multi step form. However, if you would like to get a. head start with the process and have already installed and activated both the plugin and the add on, click here to skip directly to the process.
Table of Contents:
For easier understanding, we have divided the tutorial into sections Feel free to skip any sections if you are already on the next step. To ensure easier navigation, here are the table of contents for the post today.
- Installing & Activating The Plugins & Add On
- Creating a Multi-Part Form
- Customizing & Styling the Multi-Part Form
- Saving & Displaying the Multi-Page Form On Your Site
Installing & Activating Everest Forms and Multi-Part Forms Add-on
To start off the process, Install and Activate the plugin Everest Forms. However, to use the multi-part feature, users are required to activate the premium version of the plugin as well. Once that is done, you can then install the add-ons on your WordPress site.
Installing add-ons are also a piece of cake. Once you have entered the license key for the premium version, you can install the add-ons through the add-ons option. Navigate through Dashboard>>>Everest Forms>>>Add-ons. There you can see all of the available add-ons for your premium plan. Select the option for Install Addon for Multi Part Forms. Once that is done, simply click on activate.
Creating a Multi Step Form in WordPress using Everest Forms
Now that the plugin and the add on are ready to be used, let’s get right into the process of creating a multi step form. You can see that the newly added menu for Everest Forms on the Dashboard. When you click on the menu, the sub-menu provides the option for All Forms, Add New, Entries, Settings, Status, and Add-ons.
For easier access, Everest Forms allows the users to view all of their forms and customize them with ease. The Entries option gives access to all of the entries on the forms that the forms have collected on the site. Settings allow you to make any changes and manually change the settings related to the forms and it’s layout options. You can also view the update status of the plugin through the Status Option. The Final option Add-ons is where you can directly install all of the premium add-ons from.
You will be redirected to the form creation page where you can name the form, and choose a pre-built template that you can use. However, since this is a step-by-step tutorial to create a multi step form, let’s just start from a blank page.
On the left side, there are all of the fields available that you can add into the forms. The process is pretty simple as it features the user-friendly drag-and-drop page builder. To create the first page of the form, we wanted to just add in the contact fields. So we dragged in the fields for Name, Last Name, Email, Number and also a Multiple-choice field for age.
Editing the field details is also pretty easy. Simply click on the field, change the labels, options, and other advanced settings if you require. And that’s it!
Now to create a multi step form in WordPress, you can see the option to Add New Part below the form you just created. If you click there, it will be redirected to the next blank page where you can add in fields again. On the left-hand side, the options to edit the part title and the labels are also included. We will be changing the title name here as Additional Information. The labels for previous and next is left as it is.
So, because the previous form we created was just for contact information, let’s add in additional fields for other details. Click on Add Field Tabs and start creating once more. From the advanced fields, we have added in Date, Website/URL, Address, Country and also a place for users to type in their password.
Now we have taken care of both contact information as well as any additional information we might need. For the final part of the multi-part form, we went ahead and created an option to add in their payment information. To integrate the payment method, you can also check out the premium add-on PayPal Standard.
Editing The Settings For The Multi Step WordPress Form
Now that we have created the form and added in all the necessary fields, let’s move onto the settings. From the navigation bar on top, select Settings. Here, you can customize and edit the General settings, for Emails and also for Multi-part forms. Click on Multi-part forms to reveal the options.
As you can see here, you can either enable or disable the multi-part forms clicking on the check button here. When enabled you can further change the default display. The Progress Indicator by default is a progress bar, however, the drop-down menu also has options for Arrow Steps, Circle Bar or use none of the options. Another customizing option is to choose the progress color and also to select the alignment. Since we prefer the default settings, we will leave it as it is.
Saving The Changes & Displaying The Multi-part Form
Now that we have created an entirely new multi-page WordPress form, we can now Save the Changes. The shortcode that appears on the top can then be copied and pasted on either any pages or posts.
For this purpose we will be creating an entirely new page and using the Gutenberg Block Editor, simply adding in the newly created WordPress multi-page form. Once that is done, we can now add in the page name and any other additional content. Simply publish the post after everything is according to your preference. Preview the post and you will be able to see your multi-part form.
So with this step-by-step tutorial, we hope you now know how to create an entire multi step form for your WordPress site. Everest forms have indeed made the process a piece of cake. The revolutionary drag and form field with easy customizing options, the end result is absolutely amazing. And if you don’t think so yourself, why not try it out and see for yourself?
This post is based entirely on our own opinion and backed up by thousands of happy customers! At the end of it all, we do however appreciate your feedback. Do let us know your experience with the plugin Everest Forms and what you think of it down in the comment section below! 🙂