Introduction

I found many instructions and guides in the Internet that describe How to hide related products tab on shop page to be NOT WORKING!

It's a freaking pain in the ass to hide your related products tab on your shop page. The method to actually hide related products depends on the WooCommerce theme that you are using. In this article, we are going to present a method that provably works for every theme and WooCommerce version out there.

How to disable related products - Step by step guide

Step 1. Open the product page where your related products are shown.

Step 2. Right click on the HTML with related products and open page inspect. See the picture below.

Inspect element

Step 3. Copy the class attribute of the container element that contains the related products HTML.

Copy css of container class

Step 4. Insert the copied class code to this CSS code. In my case, I copied related related-products-wrapper product-section and the resulting CSS will look like this. So you only have to replace spaces ' ' with points '.'.

In my case the final CSS code looks like this:

.related.related-products-wrapper.product-section {
    display: none !important;
}

Step 5. Replace CSS code from above with the line {{YOUR CSS CODE HERE …


Continue reading