25th Apr '23
/
0 comments

Meta Box Reciprocal Relationship in Bricks

In one of the previous tutorials, we took a detailed look at Meta Box Relationship in Bricks.

This Pro tutorial provides the steps to display items (can be posts of any post type) that are connected to the current single item via a Reciprocal Meta Box relationship in Bricks.

A reciprocal relationship connects an item to one or more items of the same post type.

Use case: For showing related posts of the same post type when a single post page is being viewed.

Relationship:

A sample post being connected to two other posts:

When any of these reciprocal posts is edited, we could see that it is connected to Hello world! post.

After implementing the tutorial, when viewing the Hello world! post on the front end:

We shall ensure that the

  • Related Posts section gets output only if there is at least 1 reciprocal/connected post for the current post.
  • The heading reads "Related Post" when there is 1 connected post and "Related Posts" when there is more than 1 connected posts.

Step 1

Install and activate Meta Box and Meta Box AIO plugins.

Step 2

Go to Meta Box → Relationships.

Add a new relationship.

Tick "Reciprocal relationship".

Select the same Post type in From and To sections.

Publish.

Step 3

Edit your posts and select the connected posts for each.

Step 4

Create (if not present) a template for single posts of your post type and edit it with Bricks.

Below the Section that contains possibly Post Title and Post Content, add a new Section and inside that, set up a query loop. Select the Post type. Set Posts per page to a large number that is higher than the maximum number of published posts that could ever exist in your site.

Set the Heading element's text to be singular. Ex.: Related Post.

We are going to later programmatically append s if there is more than 1 connected post.

Next, we need to limit the posts to only the connected posts.

Step 5

Add the following in child theme's functions.php or a code snippets plugin:

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 628 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Meta Box/ACF Images Staggered Grid Gallery in Bricks

Meta Box/ACF Images Staggered Grid Gallery in Bricks

Showing images from two Gallery-type of ACF or Image Advanced-type of Meta Box fields in a staggered grid layout.
Color Custom Field as Section Background Color on Category/Term Archives in Bricks

Color Custom Field as Section Background Color on Category/Term Archives in Bricks

How to use a color from a taxonomy term custom field for as the hero section background color on archive pages.
Categories:
Tags:
Pro
Conditionally outputting an element in a Query Loop based on date-type custom field

Conditionally outputting an element in a Query Loop based on date-type custom field

This Pro tutorial shows how to output an element in a Bricks' query loop only if the value of a date-type of custom field for…
Categories:
Pro
Posts Published in the Last x Days in Bricks

Posts Published in the Last x Days in Bricks

Updated on 1 Feb 2024 This Pro tutorial shows how to limit the posts output by either the Posts element or a Query Loop in…
Pro
Filtering posts by a group field’s subfield value with Meta Box when using a custom table in Bricks

Filtering posts by a group field’s subfield value with Meta Box when using a custom table in Bricks

Filtering a query loop to output only those posts with the value of a Select subfield of a Group field set to Yes when using…
Categories:
Tags:
Pro
Bricks Dynamic Condition – Check if today falls within 5 days before any holiday date

Bricks Dynamic Condition – Check if today falls within 5 days before any holiday date

Creating a custom condition that returns true or false depending on whether today falls within 5 days before any holiday dates selected on a Meta…
Categories:
Tags: