Show related posts in Beaver Builder from one CPT to another with ACF Relationships
Showing related posts in Beaver Builder from one Custom Post Type to another is possible with an ACF Relationship field and Beaver Themers Post Module and relationship field connector from version 1.1.1.
You can also use the Post Slider and Post Carousel Modules.
This tutorial uses 2 CPTs, ‘Lights’ and ‘Projects’, the intent is to show the ‘Lights’ used in each ‘Project’ so the reader can click the link back to see the light from a project CPT. (This is also easily done using the default ‘Post’ type with another CPT.
First up is to create a ACF Relationship field for the ‘Lights’ CPT and display it on the ‘Projects’ CPT post admin backend.
So above a field name is given and the ‘Relationship’ field type is selected, The Lights CPT is selected as the filter in ‘Filter by Post Type’ and also a custom taxonomy used in the Lights CPT is also selected, this will allow the user to filter posts by taxonomy.
This field group is then assigned to appear on the Projects CPT.
Relationship Field in Back End of Custom Post type
Now in the Projects CPT post the relationship field is visible, the posts can be search for or filtered by taxonomy, then when selected move the Light post types from the left to right dialog boxes to indicate that they are the related posts.
Displaying the Related Posts from Beaver Themer
The code used to output the related posts can be selected by using a Post Module in a Themer layout, in the ‘Content’ tab and selecting the ACF Relationship field – then add in the custom field name, as known as the key.
You can further refine the layout by doing a Custom Post Layout in the Layout tab, here I am just outputting the titles only of the related posts.
A list of clickable lights on each project post type.
Bi-directional Related Posts
It is possible to link posts bi-directionally with the use of an ACF plugin ACF Post-2-Post available also on WordPress plugin repo.
To enable the functionality between the 2 CPTs you create a new ACF field group and set up the relationship field on the other CPT using the same field name – in this case ‘tl_project_lights_link_used’ – also you have to add the ACF Relationship field via Beaver Themer post module on the other CPT Themer template.
Great tutorial, worked a treat, the only issue I am having is with the bi-directional approach.
Does that still work for you both ways? Wondered if you have a tutorial on that.
I got the first post type working fine, and both show the related post types in the back end, but when creating the Beaver Themer module on the second post type it doesn’t find anything, even though I go to edit and the post does have a product auto-assigned.
Have you ran into any issues like this?