Repeater with template widget

The ACF Repeater with template widget makes it possible to display a ACF Repeater using a Elementor template. Since you can have different types of Repeater setups there is a need to be able to display them in ways that the preconfigured widgets do not support.

You can find the widget by typing ACF repeater in the Elementor editor search field. It looks like the image below.

Instructions

Template creation

See the “How to create a repeater template” article.

Select repeater

After dragging the widget to the preview window you get access to the Repeater tab in the widget area. Here you can select the repeater you wish to display

The repeaters in the dropdown are group by the ACF Fieldgroup they belong to.

Layout and templates

You have various options to choose from when it comes to displaying your repeater items. It supports most of the CSS flexbox and CSS grid options when it comes to item layout and spacing.

Select template

The template dropdown displays detected Elementor templates. It does not filter based on Elementor template type, all templates are listed. See the “How to create a repeater template” article.

Layout options

The repeater widget support two methods of displaying the repeater items.

Row/column (which uses CSS Flex)
Grid (which uses CSS Grid)

Row/column layout

Grid layout

Grid layout supports two methods of displaying the grid Manual and Auto mode.

Manual mode gives you the choice of number of columns to display.

The Auto mode gives you the choice of setting a width of an item and the number of columns are then decided based on that and the detected widths of the page.

Since the repeater displays Elementor templates the styling of each repeater item is handle directly in the template. The widget comes with container and item height support. If need be more styling options will be added.

Updated on 2018-12-07

Was this article helpful?

Yes No

The widget