Remove Additional Information Tab Woocommerce: Alright, so it looks like that you are someone who wants to have a clean and beautiful design for your online woocommerce website. That’s amazing, clean and beautiful design often end up getting more conversions than average looking website.
But there are times when we have to go one step ahead in order to accomplish our dream design on to our online website. But don’t you worry since we at the Illusic are here to help you out with it. In this tutorial, we would be taking a look at How you can remove Additional Information Tab on your woocommerce website. Now if that sounds interesting, let us hop right into the tutorial.
Woocommerce Hide Additional Information
For those of you who don’t already know, when you add shipping information to your product in woocommerce, those details are automatically added and shown to the user under the Additional Information Tab.
Now, though you could simply use CSS to hide the information tab, it is not really recommended. Since hiding the element from the view does not mean that the element won’t be rendered, it’d still be on the page, but just not visible to the user. Anyways, let us now take a look at Pre-requisites to Hide Additional Information Tab in Woocommerce.
Pre-requisites
Before you go ahead and add the Woocommerce Remove Additional Information tab snippet on your WordPress website, make sure that you:
- Take a backup of your WordPress website unless you really know what you are doing.
- Make sure you are adding the code snippet to a Child Theme on your website. (Optional but Recommended)
Once you have those things out of the way, you are all good to add the snippet to hide additional info tab on your wordpress website.
Steps to Remove Additional Information Tab using PHP Snippet
Here are the steps, which you need to follow in order to remove the additional information tab from your Woocommerce website.
-
Step 1: Login to your WordPress website
First of all, you need to login to your WordPress website’s dashboard with the Administrator Account.
-
Step 2: Go to the Theme Editor
The next step is to go to Appearance > Menu > Theme Editor.
-
Step 3: Select the Functions.php file
Now, click on the functions.php file from the list (check screenshot).
-
Step 4: Add PHP Snippet to Remove Additional Information Tab
Finally add the following code to the End of Functions.php file and click on the Update button to save the changes.
// Remove the additional information tab by Illusic
function woo_remove_product_tabs( $tabs ) {
unset( $tabs['additional_information'] );
return $tabs;
}
add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );
That’s it! You have successfully removed the Additional Information Tab from your WordPress website. Now, for those of you who want to use CSS to Hide Additional Information tab, we have got you covered.
CSS Code to hide Additional Information Tab using PHP Snippet
Now, for those of you who would like to use CSS in order to hide additional information tab from your WordPress website, here is the CSS Code for you
/* Hide the additional information tab by illusic.comm*/
li.additional_information_tab {
display: none !important;
}Just add the above code to your Custom CSS (Customizer > Additional CSS) and you should be good to go. However, do note that this code might not work with all the themes out there.
But I don’t code, can you guys do it for me?
Are you someone who is not familiar with adding codes or are afraid of adding it on your own? Well, if that is the case, then we can help you out with the same. Feel free to reach out to us.
To conclude, this post shares how you could remove or hide additional information tab from your WordPress website or Woocommerce Store using PHP Snippet or using CSS. We would recommend you using PHP since it helps you removing the element from the page and not just hide it from the page.
That’s it for this tutorial, let us know if you have any questions or issues regarding the same. We would love to help you out.
