There are already a couple tutorials about WooCommerce product tabs on my blog, so you can find out how to create a new tab, how to rename them or change the tabs order.
Description tab
You probably remember, that the description tab of a product displays the text or HTML which is added to the main content area.
There is no specific hook for this tab, but you can use the_content filter hook, yep?
add_filter( 'the_content', 'misha_add_something_description_tab' ); function misha_add_something_description_tab( $content ){ if( is_product() ) { // I recommend to always use this condition $content .= '<p>Your custom text or HTML.</p>'; } return $content; }1
By the way, if you’re wondering, what is “About Misha” tab, we learnt how to add it in the previous tutorial.
It is also possible to use global $product to add conditions for some specific products. Like this:
global $product; if( is_product() && 10 == $product->get_id()) {
And of course, you can completely change this tab template which is /single-product/tabs/description.php
Change Product Tab Callback Function
There is one more tricky way to change any product tab content – just to replace its callback function.
Please note, that changing the function doesn’t change the tab behavior, for example if the main content area of the product is empty, the tab won’t be displayed no matter what you set as a callback function.
Here is the example of the code.
add_filter( 'woocommerce_product_tabs', 'misha_customize_description_tab' ); function misha_customize_description_tab( $tabs ) { $tabs['description']['callback'] = 'misha_custom_description_callback'; return $tabs; } function misha_custom_description_callback() { echo '<h2>Custom Description Tab Title</h2>'; echo '<p>Custom description tab content</p>'; }
Additional Information tab
This tab allows to add your custom content before or after the default tab content with woocommerce_product_additional_information action hook.
First of all I would like to remind you that the default content of this tab is the product attributes table. If no attributes over there, the tab won’t be displayed. Even if you add something to the hook.
add_filter( 'woocommerce_product_additional_information', 'misha_add_something_add_information_tab', 9 ); function misha_add_something_add_information_tab( $product ){ echo '<p>Your custom text or HTML.</p>'; }
- Use priority
9or below to add something before the product attributes table, - Use priority
11or higher to add something after the product attributes.
You can also use conditions based on a product object like if( 10 == $product->get_id() ) etc .
In case you would like to completely remove product attributes, you can use this filter hook:
remove_action( 'woocommerce_product_additional_information', 'wc_display_product_attributes', 10 );
It seems like you don’t need to edit the template of this tab, but just in a case you can find it in: /single-product/tabs/additional-information.php
Review tab
The last but least, the Reviews tab. You can find this tab template single-product-reviews.php directly in woocommerce/templates directory.
That’s all 😁
Would like to add some custom text or HTML to the Reviews tab? You have to rewrite the template in this case or change this tab callback function. No other ways. If you know another way, please let me know in comments below.
