JetEngine functionality can be used not only in Elementor builder but also in Gutenberg editor. The JetEngine plugin contains a set of blocks that are added to the Gutenberg. With the help of those blocks, you will be able to create listings and listing grids with dynamic content. Let’s take a look at how the JetEngine blocks work.
Creating the Listing template in Gutenberg
Open the JetEngine > Listings block in the WP Dashboard and click the “Add New” button. In the Setup Listing Item pop-up window choose the Listing source and From post type options. Set the Listing Item Name and select the “Blocks” option in the Listing view line.
Click the “Create Listing Item” button and proceed to build the listing directly in the blocks editor. Click the plus-shaped icon, and scroll to the Design section of the dropdown list. Open the tab and there are all JetEngine dynamic widgets, which can be used for showing the content from the custom meta fields.
Select the needed widget and click it. On the right side, there are the content settings of the widget, where you should choose a corresponding Source, customize the Layout, and add CSS Class if necessary in the Advanced block. The settings of the widgets are similar to the ones presented in Elementor page builder, so you can use these tutorials to get along with the dynamic content blocks.
When the listing is ready, click the “Update” button. The listing you have just created can be displayed either in the Gutenberg Editor or in the Elementor page builder. The same goes for the listings created in Elementor – you can use them for the Gutenberg listing grid.
Creating the Listing Grid in Gutenberg
Listing Grid widget can be found in the Gutenberg blocks set that is placed in the Design section. Its settings are similar to the widget in Elementor but without the Style block. You can use the CSS to customize it. The more detailed information about Listing Grid settings is in this overview.
Let’s have a look at the process:
Well done! Now you know how to use JetEngine Blocks for Gutenberg. Form listings easily and quickly using blocks editor in the WP Dashboard.