How to Display Specific ACF Fields in Elementor Using JetEngine

If you’ve ever wanted to showcase specific Advanced Custom Fields (ACF) data in WordPress Elementor, such as displaying a curated list of products in WordPress, this guide will walk you through the process. We’ll use tools like ACF and JetEngine to filter and display only the content you want. 

Step 1: Set Up Your ACF Field

1. Create an ACF Field Group (Skip this step if you already have one)
   • Go to ACF > Field Groups in your WordPress dashboard.
   • Create or edit a field group (example: “Color Type”).
   • Add a dropdown field for selecting color types, such as “yellow” “emerald green,” etc.
2. Configure Field Settings:
   • Set the field type to Selection (dropdown).
   • Add the options for your artwork categories.

Step 2: Build the Query with JetEngine

1. Navigate to JetEngine > Query Builder:
   • Click Add New to create a custom query.
   • Name your query (example: “Color Type Filter”).
2. Set Query Parameters:
   • Post Type: Set to retrieve posts matching your field group.
   • Post Status: Choose “Published” to display only active entries.
   • Meta Query:
     • Field Name: Use the ACF field name (e.g., “Color Type”).
     • Operator: Select LIKE to find entries containing a specific value.
     • Value: Input “yellow”

3. Save the Query:

• Click Add Query to save your configuration.

Step 3: Connect Query to Elementor

1. Create a Listing Grid:
   • In Elementor, use the Listing Grid widget to display the paintings.
   • Link the widget to the custom query created in JetEngine.
2. Customize the Display:
   • Set the grid style to Masonry for a clean layout.
3. Toggle Custom Query:
   • Turn on the Custom Query option.
   • Select your JetEngine query (“Color Type Filter”) from the dropdown.