Displaying Related Items from Several Relations in One Listing

In this tutorial, we will work with two Relations: “Departments to Doctors” and “Departments to Services”. 

In our case, we need to display posts from “Doctors” and “Services” Custom Post Types related to the current “Department” post. 

Before we proceed to creating a Query, we need to prepare two Macros. To do it quickly and easily, proceed to WordPress Dashboard > JetEngine > JetEngine > Macros Generator. 

We need to create a macro that allows us to retrieve the children posts from the “Departments to Doctors” Relation. 

For this, select the “Related Items” option from the Macros dropdown. 

In the From Relation input, choose the needed Relation (“Departments to Doctors” in our case). 

As we need to display “Doctors’ ” posts, we select the “Child Object” option in the From Object (what to show) field. 

For the Initial Object ID From (get initial ID here) input, we choose the “Current Object ID” option. 

Other fields may be left empty. 

Now, at the bottom of the page, you get the needed macro. Copy it and save it for now. 

Choose the second Relation (“Departments to Services” in our case) in the From Relation input, to get the children posts from this relation as well. 

Make sure you saved both macros. 

Now, let’s proceed to creating an SQL Query. Progress to WordPress Dashboard > JetEngine > Query Builder > click the “Add New” button. 

Type the query Name and choose the “SQL/AI Query” option from the Query Type drop-down list.

Proceed to the Custom SQL Query section and enable the Advanced/AI mode toggle.

Add the following query to the SQL Query section: 

SELECT ID
FROM {prefix}posts
WHERE ID IN (
  SELECT ID FROM {prefix}posts WHERE ID IN (
    %rel_get_items|23|child_object|current_object|%{"fallback":"0"}
  )
  UNION
  SELECT ID FROM {prefix}posts WHERE ID IN (
    %rel_get_items|11|child_object|current_object|%{"fallback":"0"}
  )
)

Make sure that you use the macros you got at the previous step instead of the “%rel_get_items|23|child_object|current_object|%” and “%rel_get_items|11|child_object|current_object|%”. 

Press the “Add Query” button to save the query or the “Update Query” button to update it.

We need to add a Posts Query now. Proceed to WordPress Dashboard > JetEngine > Query Builder > click the “Add New” button again. 

Type the query Name and choose the “Posts Query” Query Type.

Scroll down to the Posts Query section and open the Post & Page tab. Click the “Dynamic Tag” icon next to the Post In field. Select the “Query Results” option from the dropdown. In the newly appeared pop-up, choose the SQL Query you just created in the Query dropdown. And select the “List of items IDs” option for the Return field. 

Click the “Apply” button and then press the “Add Query“.

Following the How to Create Query Builder Listing Template tutorial, we created the listing template using the Posts Query source.

Once you are ready with the settings, click the “Publish” button.

Now, we can proceed to the Single Template of the parent CPT (“Departments” in this tutorial). If you are unsure about the settings for the single template, refer to our How to Create a Single Template in the Elementor Editor tutorial. 

Add the Listing Grid widget to the template.

Once you are ready with the styling settings, click the “Publish” button.

We are ready with the setup — let’s check how it works. 

The “Cardiology” post from the “Departments” CPT has six related posts — three from “Services” and three from “Doctors”.

And when we proceed to the front end of the “Cardiology” post, all related posts from both CPTs, “Services” and “Doctors”, are displayed correctly.