WooCommerce Product Tabs Not Showing on Mobile

Hi,

I’m using WooCommerce on my website, and the product tabs are working fine on desktop. However, they are not visible on mobile devices. I’m using the WoodMart theme with Elementor.

Additionally:

There is an unwanted empty space between the header and the page content.
The red circular “Sale” badge above the products is not disappearing, even when I try to remove it.
How can I fix these issues? Could you please help me?

Thanks.

Attachments:

You must be logged in to view attached files.

Hello,

Try to use the code below:

@media (max-width: 1024px) {
    .tabs-layout-tabs {
        display: block;
    }
}

Let me know the result.

Kind Regards

Yes working fine on phone, and other issues how I do?

Hello,

1. Add a negative margin to the first section to fix that empty space.

2. The sale label shows automatically when the product has a discount. The below code will help you to hide it:

.wd-product .product-labels .onsale {
    display: none;
}

Kind Regards

2nd code not working on single products page just homepage is working

Single product:

.single-product .woocommerce-product-gallery .onsale.product-label {
    display: none;
}

Kind Regards

can ı use this code?

.onsale {
display: none !important;
}

Hello,

If it works on your end and such a solution is fit for you, you can use it.

Thank you for your time.

Kind Regards

Thanks you a lot

Hello,

You are welcome! In case you need any additional help, I’d be more than happy to assist you.

Have a good day!

Kind Regards

[Author]

Posts