How to choose the needed post relations and set them with JetEngine plugin

JetEngine is the first-class addon for Elementor editor which allows adding the dynamic listing and grid layouts and provides a way to display the custom posts and taxonomies within any page templates.

Today we’ll show you how to choose the needed posts relations and how to set them with JetEngine plugin.

JetEngine provides you 3 types of such relations, so let’s take a quick overview of them.

The post relations types

One-to-one posts relation — this relations type implies that one parent post type can be connected only to one child post type. E.g., one country has only one capital, and there are no capitals that are actually related to many countries at once. So the relation between the “Country” and “Capital” post types should be “one-to-one”.

One-to-many posts relation — means that one parent post type can be related to many other child post types. E.g., one book has only one author, however, one author could have written multiple books. So the parent “author” post type should have “one-to-many” relations type with the “book” child post type.

Many-to-many posts relation — allows linking a lot of parent post types to many child post types at once. E.g., the is a “product” child post type, which is related to the “shop” parent post type. However, there are many products in each of the shops, and there are different shops where each of the products can be sold. So, the relations are “many-to-many”.

How to select post relations

Step 1 — Open the JetEngine > Post Relation directory in the WordPress Dashboard.

Step 2 — Click the Add New button and then you will need to provide the title for post relation.
After that, select the post type both for parent and child posts from the Post type 1 (Parent) and Post type 2 (Child) dropdowns.
Note! Parent and child post type can’t be the same type of the post.

Step 3 — Afterward, set the needed posts relation in the Relation type dropdown.
Here you can also see Add meta box to parent page toggle. Enable this option in order to add the meta box while viewing the parent post’s editing page.
And if you want to add a meta box while viewing the child post’s editing page to be able to set the patent post from it, toggle the Add meta box to Child page option.

Step 4 — Then click the Add Relation in order to save a new relation.

Displaying the related posts of different type with JetEngine

First, let’s clear up where we should add the related posts. Usually, the related posts are displayed on the Single post template, so in order to add them, first, one should create the template (either with Crocoblock or Elementor PRO).

Step 1 — In order to create a template with Crocoblock, open the WordPress Dashboard and proceed to the Crocoblock > My Library directory.

If you don’t use Crocoblock, you can also add a template via Elementor > My templates block.

To learn more about creating the Single post template feel free to check this tutorial.

Step 2 — Now open the Single post template to which you’ve decided to add the related posts, with Elementor editor, and drag and drop Listing Grid widget to the page’s canvas.

Step 3 — Select a listing to show in Listing dropdown. Make sure you’ve got the listing for the post type that is related to the post type template you’re now editing. If not, please, proceed to JetEngine > Listings block and here create a new listing.

Step 4 — Open Posts Query block and here add a new item.

Step 5 — Paste the %related_children_from|post-type-slug% or %related_parents_from|post-type-slug% macros inside the Include posts by IDs field (it depends on the relations between the posts, and if you’re editing the post template that is Child or Parent for the related posts.
Don’t forget to replace the post-type-slug with an actual slug of the post type.

Step 5 — Click the Update button.

Great! Now you’ve created the post relations and have set the related posts of a different type for displaying on the Single post template!