ACF Repeater Field: A Complete Guide - Elementor Addons

ACF Repeater Field: A Complete Guide

ACF Repeaters are a great way to organize multiple instances of the same data. They can be a powerful field type when the subfields repeat often. In addition, it offers flexibility and versatility, as any field type is possible within a repeater, and there is no limit to the number of repeats either.

To understand repeaters better, let us explore a use case. For example, say I want to have some client testimonials on my website. As many of the same fields are repeated, adding those same fields inside a Repeater Field makes sense, so the repeating content is organized neatly.

Setting up ACF Repeater Field Type    

With the ACF Pro Setup ready, head over to your WordPress admin dashboard to create a field group; you can skip the first step if you have already created the field group.

Step 1: Create a new Field Group   

To add a field group, go to Custom Field>> Add New. Give a suitable title to the field group.

Step 2: Creating a Repeater Field   

Now you need to create an ACF Repeater field that will hold other repeating subfields. For this, click on the Add Field button.

ACF Repeater Field

Checkout: How To Create team member section using ACF Repeater Field?

Step 3: Adding Repeater Sub Fields.  

To create subfields inside the Repeater field, click on the Add Field button and start adding fields.

ACF Repeater Sub Field

Since we are creating Testimonial sections, I have added the fields needed to create a Testimonial layout like Client Name, Image, and Description.

Step 4: Configuring the other settings:  

Once the subfields have been added to the repeater field, you can configure a few additional settings related to how it appears when viewed in the Admin area.

ACF Repeater Field Type
  • Collapsed: Select a sub field to be displayed when each field row is collapsed.
Repeater Field
  • Minimum Rows: Sets a limit on how many rows of data are required.
  • Maximum Rows: Sets a limit on how many rows of data are allowed.
  • Layout: The layout label will let you define the layout style of the appearance of the sub fields.

1: Table: Subfields are displayed in a table format. Labels will appear in the table header.

ACF Repeater Field - Table Layout

2: Block: Subfields are displayed in blocks, one after the other.

ACF Repeater Field - Block Layout

3: Row: Subfields are displayed on a two-column table. Where Labels appear in the first column.

ACF Repeater Field - Row Layout
  • Button Label: The text is shown in the ‘Add Row’ button at the front end.

Step 5: Configure the Location  

When setting up where and how fields show up, you have the choice to decide what rules make sense for your website. Of course, if you’ve already set the field locations, then you can skip this process.

Go to the Location panel.

For example, for my testimonial section, I have assigned the repeater fields to a Page. If you create repeaters for a specific post type, you can associate the custom field group to that custom post type.

Once you are done, hit the publish button and make your ACF Repeater Field live.

Template usage    

The Repeater field will return an array of rows, where each row is an array containing sub-field values.

For the best developer experience, ACF has created some extra functions specifically for looping over rows and accessing sub-field values. These are the have_rows, the_row, get_sub_field, and the_sub_field functions.

Basic loop  

This example demonstrates how to loop through a Repeater field and load a subfield value.

<?php

// Check rows exists.
if( have_rows('testimonial_section') ):

    // Loop through rows.
    while( have_rows('testimonial_section') ) : the_row();

        // Load sub field value.
        $name = get_sub_field('client_name');
        $image = get_sub_field('client_image');
        $text = get_sub_field('comment');
        // Do something...

    // End loop.
    endwhile;

// No value.
else :
    // Do something...
endif;

Checkout: How To Create a FAQ section using ACF Repeater Field?

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top