Question
How to display custom repeater fields in an Accordion widget like that?
Answer
With the JetEngine and JetTabs plugins, you can easily create repeating blocks set and display the needed information in an Accordion widget.
Requirements:
- JetEngine plugin installed and activated;
- Custom post type created;
- Single Post Page Template created;
- JetTabs plugin installed and activated;
- Dynamic data addon installed and activated (you can find it on the page with other free addons).
Creating the Custom Repeater Meta Fields
Navigate to the WordPress Dashboard > JetEngine > Post Types directory and open a CPT where you want to add the repeater fields.
Follow the detailed guide through the Repeater meta field creation process and add the necessary fields.
Fill the Fields Within the Posts
Go to each CPT post and add the needed information to the Repeater fields.
As the repeater fields will be displayed in the accordion tabs, you have to add as many blocks with information as needed. E.g., in the case of the tours, each one will have four or more days.
Once you’re done, update the post and proceed to the next step.
Working with the Accordion Widget
Open the Single Page in Elementor and drop the Classic Accordion widget.
Unfold the Items section of the Content tab and make sure that the Content Type is set to “Editor.”
Unfold the next section, Dynamic Settings, and turn on the Enable dynamic data toggle.
The Repeater field name of the Dynamic Settings will contain the CPT repeater field name.
To find the repeater field name, go back to the WordPress Dashboard > JetEngine > Post Types and scroll down to the Meta fields section.
Proceed to the following fields and enter the appropriate repeater field names from your CPT.
Once you’re done, update the page. On the front end, the Accordion widget will display the information you previously entered into the repeater meta fields of the post.
