Do you want to remove the additional information tab on the product page of your WooCommerce store?
You might want to keep the other tabs and remove the additional information tab.
To achieve this, you are required to make minor adjustments to the functions.php file.
This is very easy to accomplish, and all you need to do is follow this tutorial so that you do not break your site.
WooCommerce Hide Additional Information
When you add shipping information to your product (weight and dimensions), they are automatically added to the WooCommerce Additional Information tab on the product page.
The template for the “Additional Information” tab adds a list of the entire product attributes.
If you do some research, you will find that these attributes are added from the product-attributes.php template via this function: enable_dimensions_display().
Hiding the Additional Information Tab
It is worth mentioning that there are two methods to hide or delete the Additional Information tab.
They are a CSS and a PHP solution.
In the first solution, you input the code in your style.css, and in the second solution, you use your child theme’s functions.php.
I highly recommend using child themes because you will not lose your chances if you update the theme.
However, it is important to note that PHP is better than CSS.
This is because, with CSS, you load the element and then hide it.
If you use PHP, you will stop the element from loading. Clearly, PHP is the best way to do it.
Steps to Hide the Additional Information Tab
This is how the Additional information tab is displayed in the Storefront theme:
Here are the steps that you need to follow:
- Log into your WordPress site and access the Dashboard as the admin user.
- From the Dashboard menu, click on Appearance Menu > Theme Editor Menu.
- When the Theme Editor page is opened, look for the theme functions file to add the function to hide the Additional Information tab.
- Add the following code to the functions.php file:
/**
* Remove Additional Information Tab @ WooCommerce Single Product Page
*/
add_filter( 'woocommerce_product_tabs', 'njengah_remove_product_tabs', 9999 );
function njengah_remove_product_tabs( $tabs ) {
unset( $tabs['additional_information'] );
return $tabs;
}
- This is the outcome on the single product page:
Conclusion
In summary, this post shares how you can hide the additional information tab.
Additionally, I have highlighted that PHP is better than CSS. With CSS, you load the element and then hide it, while with PHP, you stop the element from loading
If you are comfortable handling code, you can add other tabs or rename the existing tabs.
However, if you do not feel confident, you can use a reliable plugin like the YITH WooCommerce Tab Manager.
Joe is an experienced full-stack web developer with a decade of industry experience in the LAMP & MERN stacks, WordPress, WooCommerce, and JavaScript – (diverse portfolio). He has a passion for creating elegant and user-friendly solutions and thrives in collaborative environments. In his spare time, he enjoys exploring new tech trends, tinkering with new tools, and contributing to open-source projects. You can hire me here for your next project.