Help Center
Displaying Custom Repeater Fields in the Classic Accordion Widget

Displaying Custom Repeater Fields in the Classic Accordion Widget

Display custom repeater fields in the Classic Accordion widget with the JetEngine and JetTabs plugins. Find out how to easily create a repeating block set and display the needed information.

Before you start, check the tutorial requirements:

With the JetEngine and JetTabs plugins, you can display information from the repeater field in a Classic Accordion widget. For instance, you can showcase details about the different days of a tour on its single page or recreate the steps according to your use case.

Things to know

The presented use case is taken from the Travengo Dynamic Template, available for installation for All-Inclusive set owners with the help of the Crocoblock Wizard.

Creating the Custom Repeater Meta Fields

Navigate to the WordPress Dashboard > JetEngine > Post Types directory and open a Custom Post Type editor where you want to add the repeater fields.

Scroll to the Meta Fields tab and press the “New Meta Field” button.

Complete the Label and Name/ID fields with the desired values.


The Name/ID value should include only Latin letters, numbers, and “-” or “_” characters with no spaces and capital letters.

Leave the default “Field” Object type and set “Repeater” as a Field type.

Follow the detailed guide through the Repeater meta field creation process and add the necessary fields to the repeater by pressing the “New Repeater Field” button.

repeater meta field

Firstly, we build a meta field for the label of the tab. For example, it can be a “Text” field as presented in this tutorial.

first repeater field

One more “WYSIWYG” field is built for the content of the tabs.

wysiwyg field

Once all the needed fields are created, click the “Update Post Type” button.

Filling the Fields Within the Posts

Go to each Custom Post Type post, scroll down the page, and add the needed information to the just-added repeater fields.

As the repeater fields will be displayed in the accordion tabs, you should add as many blocks with information as needed. For instance, in the case of the tours, each one will have four or more days.

days repeater field in the post

Once you’re done, update the post. 

Repeat the same procedure with all the needed posts and proceed to the next step.

Building a Query

Go to WordPress Dashboard > JetEngine > Query Builder and press “Add New” to create a new query.

In the General Settings section, set the Name and define the Query Type, now it should be set to “Repeater Query.”

new repeater query

In the Repeater Query section, specify the Source of the query — “JetEngine Meta Field.”

As the JetEngine Field, select the “Repeater” meta field that you built earlier based on the Creating the Custom Repeater Meta Fields part of the article.

In the given case, we leave the Object ID field empty as we want to display the repeater on the Single page of the corresponding post. However, if you will work with a static page, you should complete this field with the ID of the needed post.

Things to know

If your repeater has many fields and you need to pull out only several of them in this query, you can proceed to the Query Arguments section and repeat the following steps. If not applicable, just click the “Add Query” button at this point.

Press the “Add new” button under the Query Arguments section to connect the repeater fields to this query.

repeater query settings

Put the Name of the needed repeater field as the Field key/name and set its Compare operator to “Exists.”

You can add more fields by pressing the “Add new” button once again.

query argument customized

After the changes are made, press the “Add Query” button.

query arguments

Working with the Accordion Widget

Things to know

The repeater fields can be displayed with the Classic Accordion on a static page as well. In the described case, we will demonstrate how to output it on the Single template. To do so, you need the JetThemeCore plugin installed and activated on your website with the Single Post Page Template created.

Head to WordPress Dashboard > Crocoblock > Theme Templates. Open the Single Page in Elementor and drop the Classic Accordion widget.

Activate the Use JetEngine query toggle and pick the just-created query in the Select Query field.

Then, delete the two last items presented by default as toggles so only one is left.

query selected in the classic accordion widget

Open the Toggle #1 tab and press the  “Dynamic Tags” button next to the Label field.

Choose the “Current Object Field” macro from the list.

current object field macro

Once clicked, the additional customization fields are displayed.

As the Field, pick the repeater field you want to display as the tab label. You can find the needed field below the label of the query that we have assigned to repeater.

label current object field settings

Then, set the Content Type. If you use the “Template” Content Type, you should pick the template (Choose Template field) that contains the Dynamic Field with the needed repeater field set as an Object Field.

However, in the described case, we select the “Editor” option. Here, press the “Dynamic Tags” button and select the “Current Object Field” macro from the list. 

Select the needed Field to be displayed as the content of the tab.

content current object field settings

Style up the widget and update the page once you’re done with the settings. 

On the front end, the Classic Accordion widget will display the information you previously entered into the repeater meta fields of the post.

repeater item

This is all about displaying custom Repeater fields in the Classic Accordion widget, which is available with the JetTabs plugin for WordPress.

Was this article helpful?

Need help?

Ask Facebook community

Get answers from 22K Crocoblock Community experts from all over the world.

Start a live chat

Ask question to support agent and share its details via chat messages.