I have the following lines of code in my website that will display the related products at the bottom of my single product page in WooCommerce…
functions.php:
// display upsells and related products within dedicated div with different column and number of products
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products',20);
remove_action( 'woocommerce_after_single_product', 'woocommerce_output_related_products',10);
add_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20);
function woocommerce_output_related_products() {
$output = null;
ob_start();
woocommerce_related_products(4,4);
$content = ob_get_clean();
if($content) { $output .= $content; }
echo '<div class="clear"></div>' . $output;
}
As it displays 4 products that have been categorized under the same name, how would I modify the above, to display the related tags instead?
For example, I have a product category called ‘Automotive’ and within this category, are a few tags – ‘Holden’, ‘Ford’, ‘Toyota’, ‘Nissan’ etc.
I would like it to display 4 products at the bottom, related to the tag of the product the user is currently viewing.
Firstly, you can’t immediately achieve the goal you described with the code you show in your question. To understand why there isn’t a direct approach with that code you have to take a look at what you’re using –
woocommerce_related_products()
– to do what you have done so far.Secondly, you have to understand, because otherwise you are not able to ask a on point question, which should absolutely be your goal, to assure you’re getting an answer. Besides that you have to keep in mind that WordPress Development has it’s primary scope set on wordpress core related questions – if you’re interested, this is under discussion on WordPress Development Meta, one specific topic being Our wooes and future of platform plugins at WPSE. So, if you’re asking questions about plugins, like woocommerce, you should break it down to make it as related to core functions as possible – see the next point – as you can’t expect people to know every detail of every plugin you’re using.
Thirdly, now lets get into a deeper insight what’s happening. As you said, you’re using
woocommerce_related_products()
now. If you take a look at the source you see that this function useswoocommerce_get_template()
to get therelated.php
template.woocommerce_get_template()
again useswoocommerce_locate_template()
to locate the template, the latter is doing so by making use of the wordpress core functionlocate_template()
.Now there is a connection back to core, leading to the realization that the above mentioned – and hopefully inspected – woocommerce functions are essentially wrappers to extend core functionality. Another thing that became clear by analyzing the functionality dependencies is, what I said before, you need a different approach to achieve your goal, because
woocommerce_related_products()
– now undeniable obvious – isn’t the correct one.If you followed me with my explanations and have read thoroughly so far, you realized that the
related.php
contains what you are looking for. I’m especially talking about theget_related()
function, which includes thewoocommerce_product_related_posts
hook and makes use of the core functionswp_get_post_terms()
andget_posts()
–get_related()
is used to get a set of ids. Additionally there is thewoocommerce_related_products_args
hook, which can be used to alter the arguments of the related products query insiderelated.php
,WP_Query
is used for this. The query uses the resulting ids from theget_related()
call.I think you got everything on hand now to solve your problem. Actually way more than that, this gives a almost complete overview on how to customize the related products. I did not mention every functionality – function and/or hook – out of source code inspected, but definitely all the important ones. It now should be clearer how the related products functionality of woocommerce can be traced back to wordpress core functions.
Fourthly, I come to, where you should apply your customizations and what you should have asked for. For example like this:
Woocommerce has the
woocommerce_product_related_posts
hook to customize theget_posts()
call to determine related products.Code:
How can I customize this to achieve my goal? Which is to show related products that are in the same product category –
product_cat
– and have the same tag(s) –product_tag
– as the single product shown.Without giving you a concluding – at least not if you had expectation to get complete and ready made code – answer, the first thing you probably should do is change the
tax_query
parameterrelation
fromOR
toAND
.Notes:
Edit:
You really shouldn’t edit (plugin) core classes directly. It’s problematic, because you have to maintain your changes on updates again, as the core files get updated and overwritten if you perform one. Especially if it’s easily avoidable like in this case, below code does what you intended to do anyways, which is, implementing this change via your
functions.php
.Code:
For WooCommerce version 2.1.0 and upwards the above hook won’t work, as it doesn’t exist anymore, so the answer is usable until version 2.0.20. But @NathanPowell discovered a nice answer on StackOverflow regarding the from v2.1.0 on available and for the customization of the related products usable set of hooks.
Let’s not fool ourselves here guys. The accepted answer only got the user to his goal.
The very first problem lies here:
An action is removed, and then placed in the EXACT position it was removed from. The goal is completely unclear.
I came across this with a search on the related products because I did not understand that TAGS and CATEGORIES are what drives the
woocommerce_output_related_products
function in this plugin.The best answer to THIS question is the following link, and has everything to do with the
woocommerce_output_related_products_args()
filter: https://stackoverflow.com/questions/23554993/output-posts-relating-to-the-tags