Sometimes you want your blog posts to appear on more pages in your WordPress site than just your blog.
You’ve already got the option of using category and taxonomy archives, as well as tags. This can help you divide up your content and add a variety of sections to your blog or news site.
But sometimes you might have posts that relate to a custom post type. A good example of this is a store. The products in your store are custom post types, and in order to help you sell those products, you might write blog posts about them.
In this tutorial, I’ll show you how to add a list of relevant posts to each page for a custom post type in your site. I’ll do this using a custom taxonomy, whose terms will correspond to the names of those products you want to write posts about. I’ll show you how to assign the custom taxonomy to both products and standard posts, and use that relationship to output a list of posts on the single page for the product.
What You’ll Need
To follow along with this tutorial, you’ll need:
A development installation of WordPress—don’t add anything to your live site until you have it working!
A code editor.
A theme you can edit directly or one with an action hook after the content. If you’re using a third-party theme without hooks, you’ll need to create a child theme and edit that.
Setting Up the Plugin
Start by creating a new plugin and adding the header information to it:
If you're not familiar with this, check out our course on creating your first plugin. And feel free to edit the header text above, substituting your own name, URI, etc.
Registering the Post Type
If you're not working with a post type that's been registered by an existing plugin in your site, you'll need to start by registering one.
We do this by creating a function and hooking it to the init hook. In your plugin, add this:
My taxonomy is called tutsplus_product_tax. I've deliberately included tax so I know this is the taxonomy and not the post type. I also made the menu item more specific so anyone using this plugin in the WordPress admin will know when they're working with the post type and when they're working with the taxonomy.
Here it is in the WordPress admin:
You can see from the screenshot that I've also added some dummy products.
Creating the Query
Now for the fun part. We need to write a function that will fetch the taxonomy terms in our new taxonomy for a product and then output a list of posts that also have that term.
To do this, we'll use the get_the_terms() function. We'll then create an empty array of variables and add the slug of each of the terms fetched to that array. We can then use that array in the arguments for WP_Query.
Start by opening a new function and running a check to see if we're on a single post page for our custom post type. If you've given your custom post type a different name, or you're using one registered by a third-party theme, you'll have to replace 'tutsplus_product' in the code with your own post type.
function tutsplus_add_posts_to_product_pages() {
// check if we're in the product post type
if( is_singular( 'tutsplus_product' ) ) {
}
}
Fetching the List of Terms and Adding Them to an Array
Inside your function (and inside the check for being on a single product page), you now need to fetch a list of taxonomy terms for this post.
Now you need to loop through all of the terms and add them to an array of variables. But you only want to do this if the previous function has returned a list of terms, so wrap that in a check that $productterms is populated:
This fetches the slug of each term and adds it to the $producttermnames array.
Running the Query
Now we need to set up the query arguments. This will be inside your if( $productterms ) check, since you don't want this to run if there aren't any terms. Add this to your code:
Here, we've used the $producttermnames array within the tax_query arguments. This will fetch any post with any of the terms that this product also has.
This will output an h2 element with a title, and a list linking to each post. If you wanted, you could output this differently: maybe by adding the excerpt or the featured image.
Avoiding Errors
Normally, you wouldn't expect a user to add more than one taxonomy term to each product, because the terms are each related to a product. But it's impossible to say for sure that this would never happen. This is why the function includes that $producttermslist array and uses that for one instance of WP_Query, instead of running WP_Query in a foreach loop. It also makes for a more efficient page as it's only running one extra query.
The Full Function
Here's the function in full, with all the braces in the right place:
function tutsplus_add_posts_to_product_pages() {
// check if we're in the product post type
if( is_singular( 'tutsplus_product' ) ) {
// fetch taxonomy terms for current product
$productterms = get_the_terms( get_the_ID(), 'tutsplus_product_tax' );
if( $productterms ) {
$producttermnames[] = 0;
foreach( $productterms as $productterm ) {
$producttermnames[] = $productterm->name;
}
// set up the query arguments
$args = array (
'post_type' => 'post',
'tax_query' => array(
array(
'taxonomy' => 'tutsplus_product_tax',
'field' => 'slug',
'terms' => $producttermnames,
),
),
);
// run the query
$query = new WP_Query( $args );
if( $query->have_posts() ) { ?>
' . __( 'Related Posts', 'tutsplus' ) . ''; ?>
have_posts() ) : $query->the_post(); ?>
">
Running the Function
Right now, this function won't do anything. To get it to fire, you'll need to do one of three things:
Hook it to an existing action hook in your theme.
Add an action hook to your theme using do_action() and hook it to that.
Add the function name to the place in your theme where you want the list to be output.
For the second and third options, if you're working with a third-party theme, you should create a child theme and edit that. You could either create a single-tutsplus_product.php template file and add the hook or function to that, or simply add it to single.php. If you hooked it to the template file for the post type, you could remove the if ( is_singular( 'tutsplus_product' ) ) check.
In my case, I'm using the Suki theme from the WordPress plugin directory. It includes this hook in the single.php file:
do_action( 'suki/frontend/after_main' );
The hook is right below the content, exactly where I want my list to be output. So I'll hook my function to that action hook:
Once you've done that, save your plugin and add some products and taxonomy terms.
The Result
I've added the widget term to my Widget product, but I've also added another term to demonstrate this:
I've added these two terms to a number of posts in my site, and when you view the product page for a Widget, you can see the list of related posts beneath, from both terms:
This list of posts will help site visitors to access blog posts relating to that product and will encourage them to find out more about it and (hopefully) to buy.
This website uses cookies to improve your experience. AcceptRead More
Privacy & Cookies Policy
Privacy Overview
This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.
Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.