Complete Guide To Create A Multi-Page Form In WordPress – 2018

Complete Guide To Create A Multi-Page Form In WordPress – 2018

Long forms are scary and often the user ignores them. That’s why breaking a form in multi pages is a good experience and helps in improving the user experience as well as increasing the engagement.

However, creating a multi-part form in WordPress is a time taking process and requires a backend coding and auspicious technical knowledge. But, there are such plugins which can do this task in mere seconds.

Before the start, let’s get bit information about multi-step form:

What as a Multi-Step form & its benefits

Multi-Part or Multi-Step form allows you to gather more and more information without scaring the users away. Not only this, it is the best method to make it easier for a person to fill up a large form. Generally, you can split a long form into multi-parts so that user can fill it easily without feeling bored.

A few of the key benefits of using the multi-step form:

  • The very first thing, it makes a good impression.
  • The conversion rate of long-form will increase.
  • The progress bar displays form’s overview to the user.
  • By using conditional logic the form makes more personalized.

When and why you need Multi-Page form in WordPress?

The multi-step form is the easiest way to collect all data and get in touch with your users. Whether it is a contact form, email capture form, or a simple survey. The user experience experts suggest multi-page forms to overcome this problem. Therefore, this way form fields are divided into sections and pages.

multi step form

With the progress bar on the top and lower fields on the screen, users feel comfortable in filling the form. This provides a more engaging and interactive experience for your users.

Now, bending towards the point, let’s take a look at how we can create a multi-part form in WordPress.

Creating a WordPress Multi-Page form with WPForms plugin

We can easily create it by using WPForms plugin which is the most interactive friendly contact form plugin for WordPress. You will need at least a basic license costs $39.

The very first thing, you have to install the WPForms plugin and activate it. To know more details, read our guide on how to install a WordPress plugin.

After activated the plugin, you must enter your license key. You can receive this key by signing in to your account at the WPForms site.

Copy the license key and go to the WPForms>>Settings page on your WordPress website. Paste the license key and click the Verify key button.

wpforms license key

When your license key is verified, then you are ready to create your first multi-page form in WordPress.

Just go to WPForms>>Add New page, and it will launch the Form Builder.

Provide a title for your form and choose one of the templates shown below. Although the WPForms provides the ready-made form for speed up the form creation process.

form builder

Furthermore, you can choose the person who matches your form requirements closely or chooses an empty form. By clicking on a template will launch the form editor.

wpforms form edit

Just click on the field from the left column to add it to your form. Thereafter, click a field in the form to edit it. You can also drag and drop form fields.

form fields

After adding some form fields, you are ready to add a new page to your form. From the left column, under the fancy field sections click the Pagebreak field.

adding pagebreak

However, you will see that WPForms will add a pagebreak marker at the bottom and a first-page marker to the top of the page.

It will also press the submit button on the next page, and your first page will now have the ‘Next’ button.

Press the first-page marker at the top to edit your multi-page form properties. In the left-hand column, you can choose a progress bar type. WPForms permits you to use a simple progress bar, connector, circles or any progress indicator.

edit pagination

For this guide, we will use the connectors as the progress bar. You can also select the color of your page indicator.

Finally, you can provide a title for the first page.

Furthermore, now you have to click the Pagebreak marker to edit its properties. Here you can provide a title for the next page. Also, you can edit the text to display on the next button.

page title

You can continue to add form fields after pagebreak. In case you are using the Pro version of WPForms, you can also use conditional logic to show and hide form fields that are based on user responses.

After adding more fields, you can add more pagebacks if you need it. Once you’ve created your form, click the Save button at the top right corner of the screen.

Now, you’ve created successfully your first multi-page form. Now the question is – how to add multi-page form in WordPress site.

Add custom fields to your user registration form

Also, WPForms permits you to add custom user profile fields to your user registration form.

To do this, you have to add additional user profile fields to your WordPress site. The simplest way to do this is by using a plugin.

Note: WPForms’s field mapping feature works with any plugin that uses standard WordPress custom fields to add and store user metadata.

First, you need to install the User Meta Manager plugin and then activate it. After the activation process, you have to go to User>>User Meta Manager page and click on Add Custom Meta Button to continue.

customusermeta

First, you will require entering a key. This key is how the custom user profile field will be recognized internally. After that, you have to select a field type. Here, we are using a URL field to add Facebook profile URL.

Under ‘Label’, you have to enter a label that will be shown users when filling this field. Click the submit button to add a custom meta field. Now you can go to Users>>Your Profile page to view the field in action.

fbfield

Now that we have created a Custom User Profile field, then add it to the custom user registration form and then map it. You will have to go to the WPForms>>All Forms page to edit your custom user registration form or create a new one.

Next, click the field from the left panel to add it to your form. Here we add the website/url field to our form.

addfields

Now the site/URL field will be visible in your form preview. You have to click the field and WPForms will show its properties in the left panel.

We have to change the label for the Facebook profile URL from the website/url. Also, you can add a description of the field.

editfield

Don’t forget to click the save button in the top right corner of the screen to save your form.

After that, you have to click the settings button for advanced form settings and field mapping. On the Settings page, click the User Registration tab.

Now WPForms will show your form field and a drop-down menu below them to select the WordPress registration field to map it with.

You will see that WPForms will automatically map your default fields such as name, email, password etc. Along with this, you can choose a page, where you want to be redirected users after submitting the form.

You have to scroll down to the ‘Custom User Meta’ section. Here you can enter a custom meta key that you created earlier. Then choose the form field that you want to map with it.

mappingcustomfields

To save your settings, do not forget to click the save button.

Add Multi-Page form into WordPress posts and pages

WPForms makes it very easy to add forms to WordPress pages and posts. Create a new page/post or edit the existing one. At the top of the post editor, you will see an ‘add form’ button.

add form button

However, by clicking on it will bring an insert form popup. Choose your form from the drop-down list and after that click on the Add form button.

insert form

Also, you will notice the added WPForms shortcode in your post/page. Now you can save or publish this post or page.

Visit your site to see your multi-page form in action.

page form preview, Multi-Page Form in WordPress

That’s all!

We hope this blog helps you for the same. In case you have any WordPress questions feel free to ask us as you can get our expert advice. Our WordPress Support team is always ready to deliver WordPress Customer service. Dial our WordPress help phone number +1 888 614 0555 (Toll-Free).

Read More Blogs:



Leave a Reply