Back to contents

How to create a repeater with JetEngine. Repeater usage examples

In this tutorial, we’ll take a closer look at the process of creating a dynamic repeater with JetEngine plugin, which a part of huge Jet plugins family.

JetEngine plugin is a top-notch addon made for Elementor editor which provides the user with all the needed tools for displaying dynamic content.

But before we start, let’s see some examples of Repeater usage.

Let’s imagine that you need to add some information about the post author to the page: the author’s name, surname, and his photo. If there’s only one author, you will be good with a simple meta box and 3 meta field of text and media types. But what if we need to add several authors at once, and each of the posts may have a different number of authors?

To do so, you will need to create a meta field of repeater type, set several subfields, and apply it to the specific post type using JetEngine plugin.

Creating a repeater

Step 1 — Log into the WordPress Dashboard and navigate to the JetEngine > Meta Boxes tab.

Step 2 — Click the Add New button at the very top and you ’ll be redirected to the Add New Meta Box window. Provide a new meta box with the title, apply it for the specific post type (E.g. Posts, etc.) and then scroll the page down to the Meta Field block.

add a new meta box

Step 3 — Click the New Meta Field button below in order to create a meta field of a repeater type.

Step 4 — Fill in the label for a new meta field in the Label field ( let it be “Repeater”).

Step 5 — Add an ID in the Name/ID empty field and set the Repeater type in the Field Type dropdown list.

repeater meta field

Step 6 — After you have specified the Repeater field type, you will see the New Repeater Field button. Click it in order to add a new field and provide it with the label and name/ID.

Step 7 — Set the certain type in the Type dropdown (e.g. if you want to enable adding images, select the Media type, etc.). Add as many subfields as you need.

repeater name meta field

Step 8 — Then, click the Add Meta Box button to save the meta box with repeater meta fields.

Step 9 —Go back to the Dashboard and navigate to the Post tab (or the specific post type for which you’ve set the repeater meta field).

Step 10 — Open the specific post and there you will see a custom field below the content.

Step 11 — Fill the fields that are available with the required content.

If you need one more meta field with more subfields, click the Add Item button.

enrich the meta fields with content

Step 12 — After that, open the page’s template with Elementor editor, drag and drop Dynamic Repeater to the page’s canvas.

Step 13 — Set the source in the Source empty field (it should be the repeater meta field you’ve just created) and input the needed macros into the Item format field. The full macros list you can find here.

customizing Dynamic Repeater widget

Here you can also customize the appearance of dynamic content in the Style and Advanced sections.

Step 14 — When the customization is over, click the Update button.

That’s all. Now you can add dynamic content to the website with a little coding with the help of JetEngine plugin.