If you’re using a child theme with your premium WordPress theme (and you should be!) you might be struggling with adding code to your functions.php
file. Removing “Related Products” from a WooCommerce single product page gives us the perfect opportunity to explore this.
If you’ve ever needed to switch off the Related Products in your eCommerce site, there are plenty of websites which give you the code to do so:
/* Disable Related products on single product pages */
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products',20);
Looks simple, right? All you have to do is remove the action that loads the related products into the page. Unfortunately, if you add this code to the functions.php
file of your child theme, it doesn’t work.
Ok, why not?
First, you need to understand that your child theme’s functions.php
file doesn’t act in the same way as its style.css
file. Typically, the parent’s stylesheet is loaded first, then the child’s, so that any styling you add to the child’s stylesheet will overwrite the parent’s. The functions.php
file doesn’t act like this:
Unlike style.css, the functions.php of a child theme does not override its counterpart from the parent. Instead, it is loaded in addition to the parent’s functions.php. (Specifically, it is loaded right before the parent’s file.) In that way, the functions.php of a child theme provides a smart, trouble-free method of modifying the functionality of a parent theme.
“Trouble-free”… 🙂
So why does the above code not work in a Child theme? The problem is, because the child functions load before the parent functions, if you remove an action in the child, the parent may very well put it straight back!
What we want to do is remove the action after WordPress has loaded, but just before it begins to build the HTML webpage. To do that, we will use the init hook:
add_action( 'init', 'remove_parent_actions');
function remove_parent_actions() {
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20 );
}
Prior to init, all the actions for building the request page are queued up. You can see from the above code that we create a function that uses the same code – the action which removes the WooCommerce Related Products – but we hook it into init.
Now, that action is removed and won’t be put back.