When you click on this post we believe you are looking to find out some way to add fields to your forms so that users submit all the necessary information in a clear order. Hence there’s a way out which makes us write this article.
So if you want to allow users to add fields to your form, in this article, I’ll show a step-by-step guide to how you can let users add repeating sections in WPForms.
Table of contents:
What is a Repeater Field in WordPress?
WPForms repeater fields enable users to add multiple particular fields in a form by duplicating the existing fields. This allows users to submit multiple sets of data easily by clicking on the “Add” button option.
Why you should build repeatable blocks to your forms?
There are cases when you can’t be sure how many fields the user will need in the form. Thus, by giving users the ability to add fields to your forms, you can make the form more adaptable to different use cases.
For example, they want to add more fields to leave comments or mention designs, colors, sizes…related to their uniform order. By doing so, you can ensure that you get all the information you need to complete an order successfully.
You should notice that the flexibility and functionality of the form on your website can be improved with the WPForms Repeater Field to provide a delightful user experience. Since users are given the ability to add the necessary fields by themselves, it assists in the creation of clear and engaging forms without lacking any essential details from users.
With that said, let’s step through our tutorial on how to build a repeater field in WPForm.
How to Create a WPForm with Repeatable Fields?
Step 1: Select the Best WordPress Plugin
We recommend using WPForms Repeater Fields by Add-ons.org to build a repeater field in your forms, as shown in this tutorial.
Step 2: Install and Activate Plugin
After downloading the plugin, it’ll be saved as ZIP files on your device.
Installing WPForms is easy and similar to installing any other WordPress plugin. Now, go back to the WordPress dashboard and open Plugins >> Add New – Upload Plugin and choose the ZIP files, then install and activate it.
Step 3: Construct a WPForm with Repeating Sections.
To create a new form, click on WPForms from the left sidebar of the WordPress dashboard.
Now click on the Add a New Form button.
You will see the window, let’s start with a New Blank Form.
Click Blank Form, a new page appears on your screen that looks something like given below. It’s the interface of WPForms.
On the left are all the form fields available for use and their field options. On the right is where you build the form by adding rows and placing fields in them. All you have to do is drag the fields from the left into the row on the right.
Let’s create a Working History form where we will let applicants add fields for including their rich experience in the past.
First, we add Name Fields and a Single Line Text for Position Fields.
Click on the Field Options. You can customize the label, format, and size… You can also make any field required so that a user can not submit the form unless filling up that required field.
Click on the Start Repeat from the Standard Fields tab to add it to your form.
Open the Field Options, change the Label to Working History
Then add three Single Line Text, change the Lable to Company, Job Description, and Achievements like below:
Click on the End Repeat from the Standard Fields tab to finish repeatable blocks. And click on Save when you’re done. You can view what the form looks like in the front-end with the Preview feature.
Step 4: Customize and Configure Form Settings
After adding Repeater fields, it’s time to customize the form fields for the Repeater Rows.
Simply click on Start Repeater, and you will see the properties:
- Title: An optional title before each row of the repeater
- Show index: Use the placeholder to print the current row index
- Field Size: Select the default form field size
Simply click on End Repeater, and you will see the properties:
Add button text: You can change the text of the “Add” button.
Initial row: You can set the number of repeater fields shown first
Limit: Max number of rows applicable by the user, leave empty for no limit
Additionally, for the overall settings of the WPForms, navigate to Settings >> General. From here, you can change the form name, description, and tags, correct the submit button text that appears to the user after form submission, and so on.
In a similar way, you can go to Settings >> Email to configure your email notifications. From here, you can easily set the to and from email addresses for the delivery of the email. You can even enable conditional logic if you want.
Furthermore, it has the option to enable anti-spam.
Finally, you can modify Confirmation after users submit your form.
Step 5: Publish your form
After completing all of the previous steps, you click on Save and Preview to look at how your form appears from the front end.
When the user wants to add more data, they can simply click on the ADD button and submit the form. Besides, they can also remove the repeater fields using the X button if they don’t want to add the data.
You can refer to this video demo
Wrapping up
In this article, we tried to give you a detailed guide on how you can allow users to add fields to your WordPress form. So don’t forget to install the WPForms Repeater Fields plugin to make it easier than ever to create custom forms with repeater fields to place on your site.
You can refer to some documents related to The Repeater Field WPForms: