One of the common practices in e-commerce stores is to display related products on a product page. This is done in order to encourage visitors to check out other similar products and consider buying them.
Many WooCommerce themes are no different and have similar functionality.
For example, take a look at a default Storefront WooCommerce theme:
However, in some cases, you may want to disable this functionality. In this article, I’m going to show you a few different ways to do it.
Method #1: Hide Related Products With Code
This is my favorite way to do it as it’s super clean and simple to do.
Here is the piece of code that you need to use to hide related products:
remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20)You need to add this piece of code to the functions.php file of your child theme (don’t edit the parent theme).
This will make sure that related products aren’t loaded and shown on the page.
Alternatively, you can install and use a plugin like Code Snippets to add this custom code.
Another alternative is to use this CSS code:
.related.products {
display: none;
}However, this approach has some drawbacks as the related products are still being loaded on the page, but they’re just being hidden.
So treat this as a quick and dirty workaround.
If you decide to add this code, you can add it to your child theme’s style.css.
You can also customize your WordPress theme and add this code by going to Appearance -> Customize -> Additional CSS in your admin area and adding this piece of code there.
Method #2: Hide Related Products With A Plugin
Another method of hiding related products is to use a free plugin like NS Remove Related Products For WooCommerce.
According to the plugin’s documentation, all you need to do is to install and activate the plugin and then enable this setting:
Method #3: Hide Related Products With Your Theme’s Settings
In some cases, your theme may have a setting to hide related products. Since there is a very wide variety of themes, it’s hard to be specific about where this setting might be. In all likelihood, you will find it somewhere in the Single Product page settings section or page in your theme’s settings.
Wrapping It Up
There are multiple ways to hide related products in WooCommerce. Some of them require a bit of coding, while the other methods don’t. Pick whatever option you think will be the best for you and use it.
