Saturday , February 22 2025

How to hide the Details tab in the Woocommerce product card

The attributes of the product are displayed in the tab Details/Additional Information. If only a 1-2 of attributes are displayed on your site, then the tab will look ridiculous without content. There are two options: hide the tab using css styles, or delete it using the engine.

Option 1: hide the Details tab using css styles

li.additional_information_tab {
    display: none !important;
}

You need to add this code to style.css. Despite the fact that the code can be placed in header.php/footer.php, but it is more correct to add styles in a css file.

Option 2: delete the Details tab using functions.php

function woo_remove_product_tabs( $tabs ) {
    unset( $tabs['additional_information'] );
    return $tabs;
}
add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );

About iryna

I'm Iryna, a web developer from Ukraine with a decade of experience solving complex technical challenges in the world of freelance. Throughout my career, I've worked on everything from troubleshooting server-side issues and optimizing website performance to enhancing user interfaces. On this blog, I share detailed solutions to the technical problems I’ve encountered and methods that have worked best for me. In addition to my technical expertise, I’m also passionate about digital drawing. I hope the tutorials and insights I provide here will help both fellow developers and creatives alike in their own projects.

Check Also

How to remove 404 //fonts.gstatic.com and //fonts.googleapis.com from WordPress head section

I tried solutions with functions that should remove from head and , but a very …

Leave a Reply

Your email address will not be published. Required fields are marked *