Remove the Additional Info tab in WooCommerce – Learn WordPress from a to z

Tutorials 0 lượt xem

When you add products with variations, such as color, size, etc., when displaying products on the homepage, a tab will appear to display this information. However, this tab will only display product variant information, and nothing else. So many people will feel uncomfortable with this Tab. For example, in the image below.

Remove the Additional Info tab in WooCommerce

If you want to remove this Tab, it is easy, here I will guide you to remove the Additional Information Tab with 2 ways.

The first way is to use CSS to hide this Tab, not showing it anymore. Paste the following CSS into the child theme’s style.css file:

/* Hide the additional information tab */
li.additional_information_tab {
    display: none !important;
}<div>
<span>1</span><span>2</span><span>3</span><span>4</span>
</div>

However, the use of CSS is also effective, but actually the content of the Tab is still loaded by the Website, it’s just the CSS that it is not displayed. Therefore, I should use PHP, so that the system does not load this information from the database. Therefore, I will use PHP to help reduce a bit of work for the website.

To use PHP, add the following code to the child theme’s function.php file:

function kenthan_remove_product_tabs( $tabs ) {
unset( $tabs['additional_information'] );
return $tabs;
}
add_filter( 'woocommerce_product_tabs', 'kenthan_remove_product_tabs', 98 );
<div>
<span>1</span><span>2</span><span>3</span><span>4</span><span>5</span>
</div>

That’s it, now you can go outside to see your work. The Additional Information tab  as well as its data has been completely removed.

Bài viết liên quan