Repeater
Basics
A repeater is a list of items such as text, images, links, buttons, that have the same design and layout but have different content that is individually customisable.
The Repeater block will not activate until you add some items. Remember to update the page after adding items.
Add
If you want to add a repeater block outside any other block on the page:
Click on the ➕ icon to open the Inserter Panel
Search for the
repeaterblockClick on the
repeaterblock to insert it into your page
If you want to add a repeater block inside a parent block:
Open the Quick Insert panel in the parent block
Search for the
repeaterblockClick on the
repeaterblock to insert it into your parent block
Repeater Block Placeholder
When you add a repeater block, a Placeholder will appear.
This will give you the choice to set your Source or, if you haven't already set up your ACF repeater, to do so first.
Set Source
Set Source will take you to the Source tab in the Primary tab where you can choose the required ACF group in the dropdown.
Create ACF Repeater
Create ACF Repeater will take you directly to the Custom Fields tab in the Dashboard where you can set up a new ACF field group.
Click on "Add Field Group" to create a new Field Group.
ACF Group
The ACF Group allows you to select a list of items to use in your repeater.
To create a new list, navigate to the custom fields menu in the Wordpress dashboard and add a new field group. (Set the field type to repeater)
When you click Field Type, it will open a dropdown.
Select the Repeater type.
Input Field Label, which is the name of your repeater.
Click "+Add Field".
Select the Field Type you require in the dropdown: Text, Image, Gallery etc.
Input the Field Label (what you want to call it).
Click "+Add Field" to add a new Field.
Repeat the process for the different field types you want in your repeater.
When you have completed all your Fields, click "Save Changes".
For more detail please visit:
ACF Field
An ACF Field allows you to group personalised information about a specific content, such as title, description, image.
To select an ACF field, first select an ACF group in the source tab of the Primary tab.
Then chose the ACF field in the ACF field dropdown.
Repeater Field in Editor
The Repeater field can be found in the editor at the bottom of the page.
Click on the arrow to open the Repeater window.
The window will show the field types you have already set up.
Click "Add Row" to add the first row to your repeater.
Input the fields you created previously, for instance Title, Name, Image etc.
Click "Add Row" to create a new row.
Input as before and continue until you have filled in all the rows you. require.
Remove Repeater Row in Editor
To remove a row, hover over the row and click the - (minus) button.
Remember to refresh the page for the input data to appear.
Your repeater fields in the editor should look something like this.
Layout
The Layout tab allows you to modify how your Items are displayed in your Repeater block. This includes Display, Grid Type, Auto Grid, Auto Template as well as Height, Column and Row Gap.
Open the Layout tab in the Primary tab and set the required layout.
See Query Template Layout (they work in a similar way).
Colours
The Colours tab allows you to modify the Colours of the content in your Repeater block, including Text colour, Link colour, Background colour.
Modify
Select a
repeaterblockOpen the Block Inspector
Navigate to the Primary tab
Open the Colours tab
Modify the Colours of your text, link, background
Reset
Select a
repeaterblockOpen the Block Inspector
Navigate to the Primary tab
Open the Colours tab
Click required dot(s) to remove modifications to the Colours of your text, link, background
Grid Editor
The Grid Editor tab allows you to visually edit & design your Repeater Grid layout.
The Grid Editor is enabled in the Layout tab by selecting the grid layout.
See Query Template Grid Editor (they work in a similar way).
Location ID
The Location parameter allows you to set the source for your Repeater. This can be a Specific Post ID or an Options page (in preparation for nested repeaters).
Post ID
This allows you to set the source for your Repeater using a Specific Post ID
Select
Select a
repeaterblockOpen the Block Inspector
Navigate to the Primary tab
Open the Source tab
Find Location ID
Select Post ID in dropdown
Input ID
Reset
Select a
repeaterblockOpen the Block Inspector
Navigate to the Primary tab
Open the Source tab
Find Post ID
Click dot to reset
Options Page
This will allow you to choose the source for your repeater if you have created an Options Page.
Last updated