Back to contents

JetEngine: Grid Gallery and Slider Gallery Options of Dynamic Field Widget

This tutorial provides a detailed guide on displaying a dynamic gallery for a post or a term within grid and slider using JetEngine Dynamic Field widget.

Showcase image galleries for default posts using meta fields of the gallery type from the meta box created with JetEngine. You will be able to customize the appearance of the grid and slider galleries according to your needs in the Dynamic Field widget.

1 Step— Enable the modules

Go to JetEngine > JetEngine Dashboard > Modules tab in the WP Dashboard. Enable the Grid Gallery for Dynamic Field and the Slider Gallery for Dynamic Field toggles. This is going to enable the corresponding options. Don’t forget to click the “Save” button below.

JetEngine dashboard modules

2 Step— Create meta field

Now you have to add a Gallery-type meta field. If you are working with the Custom Post Type you can add the new meta field in JetEngine > Custom Post Types tab. And in case you would like to add the meta field to the default WP Posts, open the JetEngine > Meta Boxes block, create the meta box and assign it to the Posts. If you need a helping hand – this tutorial describes how to add a meta dox to the WordPress post. Create the Gallery meta field and hit the “Update” button.

gallery meta field

Then, open the post, scroll it to the meta fields and add pictures to the Gallery meta field. After that, click the “Update” button.

meta field Gallery

3 Step— Use the callback in Dynamic Field widget

Open the post’s listing template with Elementor editor. To showcase the post gallery, find the Dynamic Field widget in the panel and drop it to the page. In the Content menu field choose “Meta Data” option in the Source field and the recently created meta field in the Meta Field drop-down list.

Enable the Filter field output option and in the Callback drop-down menu select the “Images gallery grid” or “Images gallery slider” option. There are some settings, with the help of which you can customize the design of the post images gallery.

Dynamic Field gallery

Afterward, style the gallery according to your taste in the Style > Misc tab, and click the “Update” button to save the changes.

Now you learned to create a custom gallery and display the imagery in the posts easily with the JetEngine Dynamic Field widget.