How to Add a Repeater field

How to Use the Repeater Field in WPForms [Quick & Easy]

Editorial Note: We may earn a commission when you visit links on our website.

Wondering how to insert a repeater field into your form to capture more data for each submission?

Repeater fields in forms allow users to input multiple sets of similar data while making the forms more intuitive and user-friendly.

In this article, I’ll show you the easiest way to design a repeater field for WPForms to boost your website’s functionality and user experience.

Create Forms With Repeatable Fields 🔁

How to Make a Form With a Repeater Field in WordPress

Follow these steps to create a form with repeater fields for your WordPress site:

Step 1: Install WPForms Pro

WPForms offers a super intuitive and effortless solution to creating repeater fields. To start, you’ll need a WPForms Pro license.

WPForms Pro Pricing

After obtaining WPForms Pro, go ahead and install the plugin on your site. If you aren’t familiar with plugin installation, check out this guide on installing WPForms.

Once WPForms Pro is installed and ready, you’ll be able to create forms with repeater fields and also access tons of impactful features and addons like Geolocation, Google Sheets, and more.

Ready? Move on to the next step to begin creating a form with repeater fields.

Upgrade to WPForms Pro Now 🐻

Step 2: Create a New Form

While in your WordPress dashboard, hover your cursor over the WPForms sidebar menu and click Add New.

Add new form

You’ll now need to give a name to your form and either choose a template or build your form from scratch. WPForms comes with 1,800+ form templates, allowing you to create any type of form in WordPress.

But, in order to illustrate working with Repeater fields in WPForms, I’ll start with the Blank Form and build it up from scratch.

Create a blank form for repeater field

In just a few seconds, the form builder screen will load, where you can build your custom form using drag-and-drop controls. For the sake of simplicity, let’s create a form with just three fields: Name, Email, and Phone.

But if we want these fields to be repeatable, the first thing we need to do is insert the Repeater field by dragging it from the panel on the left to the right.

Adding repeater field

After inserting the Repeater field, click on it to open the Field Options related to it on the left.

I’m going to leave the Display setting to default because this works just fine for my scenario.

But for my setup, I’m going to need a three-column layout. You’re free to select the layout that works for you by simply choosing one of the 9 layout presets available for the Repeater.

Repeater field layout preset

As you select the layout, you’ll see the preview on the right change instantly with drop zones appearing in columns. These are the areas where you can insert any other fields that you want to make repeatable.

But first, let’s rename the Repeater field while we’re at it. You can do that by editing the label in the Field Options.

Repeater field label

Next, it’s time to insert the fields inside the Repeater field drop zones. After dragging the Name, Email, and Phone fields one by one to the Repeater field drop zones, here’s what the form looks like:

Fields added inside the Repeater block

You might have noticed something feels a bit off here. And you’d be right. The Name field is split into two rows, which doesn’t look nice in the current visual context.

But this is an easy fix. In the next step, I’ll customize some of the settings and appearance t

Step 3: Customize the Repeater Field

Since I want all the fields in my repeater section to appear in a single row, I’ll change the format of the Name field so that it aligns with the other fields.

You can do that by clicking on the Name field to open its Field Options, where you’ll find the Format dropdown on the left-hand pane. Click on the Format dropdown and select Simple.

Name field format

You’ll notice that the Name field has been reduced to just a single field so that it’s in line with the other fields.

Repeater field ready

At this point, the repeater field is ready. But before we proceed to publish the form, let’s go over some additional Repeater field settings that you might want to check.

(Optional) Additional Repeater Field Settings

Click on the Repeater field to open the Field Options once again.

If you scroll down the left-hand panel, you’ll see options for setting the minimum and maximum amounts of time the repeater field can be duplicated by the visitor. Simply enter the numbers to conveniently set your limits.

Repeater field limits

Next, let’s scroll back up to the top of the Field Options panel. This time, click on Blocks under the Display options.

Repeater Blocks mode

When using the Repeater field in the Blocks mode, you get additional settings. For instance, you can also customize the “add” and “remove” buttons that visitors will use to duplicate the field or remove a copy of it.

You can choose from different Button Types and edit the Button Labels.

Repeater block settings

Besides, you also have the freedom to add a group of fields in multiple rows when using Blocks mode. With Rows, you’re only limited to adding fields in a single row.

Rows work just fine for simple requirements, such as the form that I’m building in this tutorial. However, the Blocks option gives you more control for more advanced use cases where you need to make a larger group of fields repeatable.

When you’re done making changes, make sure to press the Save button.

Save form

Great job! You’re almost ready to publish the form.

Step 4: Publish Your Form with Repeater Fields

WPForms makes it easy to embed your forms and start collecting submissions. You can begin the embed process by clicking on the Embed button at the top of the form builder.

Embed your form with the embed button

After that, a modal will appear that will let you select your embed method. Let’s select Create New Page.

Create new page

Next, enter a name for your form and click on Let’s Go.

Embed in page

After that, the WordPress block editor will open. The form you just created with the repeater field should already be embedded here.

Now would be a perfect time to style your form using the block editor. In particular, you may want to try adding a theme to your form to give it a modern look.

You can select a theme by clicking anywhere on the form to open the Block options on the right-hand panel. Scroll down to the Themes section and pick one.

Form theme - Flynn

With your form looking all sweet and impressive now, go ahead and publish it when you’re ready. Just press the Publish button at the top.

Publish form

When you have finished publishing the form, the only thing left to do is test the embedded form to ensure it functions as expected on the frontend.

Here’s a quick demo of me testing out the form and checking everything is OK with the Repeater field functionality by submitting a test entry:

Using the repeater field

And everything’s working exactly as expected! 🙂

So there you have it. With the repeater field, you can now easily create dynamic forms that the user can control. That’s the key to boosting user engagement and satisfaction necessary for collecting form submissions at scale.

Create a Form with a Repeater Field

More Questions about WPForms’ Repeater Field

Creating repeater field forms is a popular topic of interest among our readers. Here are some quick answers to a few of the most commonly asked questions:

What is a repeater field?

A repeater field is a versatile tool, letting users dynamically add multiple sets of identical fields in a form. Picture it as a “copy” button for a group of fields. It enhances flexibility when inputting repeatable data, like multiple registrations.

Why choose the WPForms repeater field?

The beauty of the WPForms repeater field is that it makes data collection easier for you and your visitors.

  • User-Centric Design: By introducing repeater fields, you empower users to dictate the extent of their input. It’s a subtle nod to user autonomy and enhances the overall user experience.
  • Flexibility in Form Design: Every form isn’t one-size-fits-all. With repeater fields, you can cater to various scenarios—be it a single entry or multiple entries, ensuring your form adapts to diverse requirements.
  • Consistent Data Structuring: One of the challenges with multiple fields is inconsistent data. The data remains structured and uniform with repeater fields, simplifying backend processing and analysis.
  • Reduced Form Length: Instead of having a long, intimidating form with numerous fields, repeater fields provide a cleaner look, ensuring users aren’t overwhelmed at first glance.

Whether you’re an entrepreneur aiming for better client onboarding or a blogger keen on efficient data collection, the WPForms repeater field is invaluable.

Next, Learn How to Create an Accordion Form in WordPress

Are you looking for a simple way to add an accordion form design to your WordPress website? Check out our post on the simplest method for creating an accordion form using WPForms to boost your website’s usability and user experience.

Create Your WordPress Form Now

Ready to build your form? Get started today with the easiest WordPress form builder plugin. WPForms Pro includes lots of free templates and offers a 14-day money-back guarantee.

If this article helped you out, please follow us on Facebook and Twitter for more free WordPress tutorials and guides.

Using WordPress and want to get WPForms for free?

Enter the URL to your WordPress website to install.

Comments

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.