Repeatable fields
Single fields or blocks of fields (sections) can be defined as "repeatable".
The exception here is the new native Shopify data types, which due to their inherited limitations, cannot be repeatable.
This means that rather than having a 1:1 relation between a field and its value (depending on the field's type), a field's value can become an array of said values. The actual number of occurrences within that array doesn't need to be known when you define the field, but rather the number of values is defined dynamically by you when editing the field for a specific object. Examples:
  • Ingredients for an article about a certain recipe
  • Features or specifications for a specific product
  • Set of questions and answers for an FAQ list on a page
The ACF editor will show you each field's or section's value index ("1 of 2", "3 of 10" etc.) next to each field or section to help you keep track of the defined values:
Use the controls to move fields or entire sections up or down in sequence or to either remove the occurrence or to 'repeat' it. Repeating a field or a section will insert another occurrence after the position of the element being repeated.

How to loop over repeatable fields

Arrays stored in Shopify metafields are automatically converted to an iterable array when used from Liquid. This makes it easy to loop over the values as well as access individual items as shown here for a simple list of ingredients:
1
<p>Ingredients:</p>
2
<ul>
3
{% for ingredient in product.metafields.accentuate.ingredients %}
4
<li>{{ ingredient }}</li>
5
{% endfor %}
6
</ul>
Copied!

How to loop over repeatable sections

Now when you need to loop over the contained fields for an entire section, it's important to know that sections are not custom fields in their own right, so you cannot reference them via directly via Liquid. Rather we need to select one of the fields to do the loop and then reference the other field(s) via the index provided by Liquid:
1
<h1>FAQ</h1>
2
{% for question in product.metafields.accentuate.questions %}
3
<h3>{{ question }}</h3>
4
<p>{{ product.metafields.accentuate.answers[forloop.index0] }}</p>
5
{% endfor %}
Copied!
Be sure to loop over a field, that you know will have content. If all occurrences of a repeatable field are empty, the metafield will not exist and your loop will not execute.
You can use Liquid's array filters like first, last, size, sort, sort_natural, uniq etc. to manipulate the arrays stored in the metafields and thereby control how the values are presented via the store front. Please note that a repeatable field stored as an array can still contain multiple selection of values in each of the array's elements either separated with "pipe" symbols ("|") or as individual arrays in their own right.

Changing an existing field to be repeatable

You can define an existing non-repeatable field with values already in place to be repeatable, but the underlying metafields won't become an array before any value(s) are saved via the ACF editor. Reversely, if you remove the repeatable setting from a field where multiple values have already been saved, the underlying metafield won't revert from an array to a string before a new value is saved via the ACF editor - the editor will suggest the value from the first occurrence as the default.
When defining a section as being repeatable, all fields belonging to that section are marked repeatable as well. This is what you'd expect, but removing an already set "repeatable" checkmark for a section does not remove the "repeatable" setting for the individual fields as you might expect. They will revert to being repeatable on a single-field basis and you'll have to edit them individually to match your needs. This "quirk" has to do with ACF being backwards compatible with individual fields defined as repeatable before it was possible to do it for sections as well.
Last modified 11d ago