Add taxonomies to a custom post type in Beaver Builder
Thanks to Julie Wolpers on the Beaver Builder Facebook Group page, I was able to figure out how to get this issue resolved: Beaver Builder always show a summary of the Categories and tags associated with your post at the bottom of the single post, circled in yellow below:
However when you create a custom post type with custom taxonomies, BB doesn’t display the information as it’s only looking up standard taxonomies:
What we need is a way to replace the standard templates Beaver Builder uses with our own by using a Beaver Builder child theme and custom post templates.
The first thing to do is download or create your own Beaver Builder child theme. Once you’re done and you’ve installed and activated your child theme you need to copy over the template files that Beaver Builder uses to display single posts.
What we’re going to do:
- Create a custom post type called ‘Distributors’ to handle storing contact details for our network of international selling agents
- Create custom taxonomies called ‘Regions’ and ‘Countries’ to group our distributors according to their locations
- Copy the Beaver Builder single.php file from the bb-theme folder into your child theme folder and call it single-distributors.php
- Copy the Beaver Builder content-single.php file from the bb-theme folder into your child theme folder and call it content-distributors.php
- Adjust each of the files above so that Beaver Builder uses them to display your custom ‘Distributors’ posts and displays the custom taxonomies as desired.
We’re presuming you’ve already created your custom post type and taxonomies, but if not use either ‘custom post type ui’ or similar plugin or code it yourself. Make a note of all the post type and taxonomy names you use as we’re going to use those to name our files and later in our code.
Copy the single.php and content-single.php files into your child theme folder and rename them according to your custom post type slug – in our case, it’s ‘distributors’ so we’ve named our filess single-distributors.php and content-distributors.php. It’s vital you name these files according to your post type slug otherwise, WordPress will not use your customised template files to display the custom posts.
Once you have renamed the files, you’ll need to adjust them as follows.
Amend your single.php file
For single-distributors.php, we added the Template name at the top of the code and adjusted line 16 to call our new content-distributors.php file instead of the normal content-single.php file.
What this file does is lay out the basics of the page: line 7 renders the header, lines 9 to 23 render the content section including the content and sidebar and line 25 renders the footer. Next, we’ll need to head over to the content-distributors.php file and make some adjustments there.
Amend your content-single.php file
What the standard content-single.php file is doing is running through some options to determine whether or not, and where to show the featured image (lines 1 to 14 and lines 24 to 40), it renders the post title and post top meta (lines 16 to 22) and then renders the post content (lines 42 to 59).
It’s from line 61 onward that we’ve added our custom code to handle our taxonomies. In lines 62 to 63 were introducing a few DIVs with standard BB classes to enable our categories to sit in line within the content above. The classes also handle the way the output is styled and should render as your theme customisation options.
In lines 64 to 74, we are asking BB to render the selected REGIONS for our post, adding a counter to make sure the comma on line 71 isn’t rendered on the last category. We also make sure on line 70 to render the output as a URL to the slug archive.
Going through the same process on lines 76 to 86, we’re outputting the COUNTRIES associated with the post, including the URL for the archives for each. After that, we close the DIVs.
Lines 90 to 95 are the original elements of the content-single.php file with line 90 commented out as we don’t want BB to try and render any other post taxonomies after our own.
Once all that has been put together, create a new custom post type and you should have working custom taxonomies displayed in the single posts. If you have a better solution or have any tips to improve this method, let us know in the comments below.