For simple product type, the WooCommerce product single page displays only 2 tabs(Description and Reviews).
If your product has attributes then it’ll be seen as Additional information as an extra tab.
Sometimes, You’ll need to display extra information within a custom tab. For example, provide an FAQ tab where common question’s answers will be displayed.
No Code Solution
Coding Solution
Registering the custom product tab is so easy! You need to use woocommerce_product_tabs filter hook. You’ll find this hook in
woocommerce/templates/single-product/tabs/tabs.php:29
/**
* Filter tabs and allow third parties to add their own.
*
* Each tab is an array containing title, callback and priority.
*
* @see woocommerce_default_product_tabs()
*/
$product_tabs = apply_filters( 'woocommerce_product_tabs', array() );let’s register the FAQ tab
add_filter( 'woocommerce_product_tabs', 'custompft_add_tabs' );
/**
*
* Register your custom product tab.
*
* @param array $tabs Tab List.
*
* @return array
*/
function custompft_add_tabs( $tabs ) {
$tabs['custompft_faqs'] = array(
'title' => __( 'FAQ', 'text-domain' ),
'priority' => 50,
'callback' => 'custompft_tab_content',
);
return $tabs;
}
/**
* Display FAQ contents.
*/
function custompft_tab_content() {
$faq_content = get_post_meta( get_the_ID(), '_custompft_product_faq_content', true );
?>
<div>
<?php echo wp_kses_post( $faq_content ); ?>
</div>
<?php
}$tabs array must contain a unique key and the value should be 3-things
- title: Humen readable text, also can be translateable
- priority: Set integer value, Lower number display as first
- callback: A function for content
WooCommerce product’s default tabs array
array:3 [▶
"description" => array:3 [▶
"title" => "Description"
"priority" => 10
"callback" => "woocommerce_product_description_tab"
]
"additional_information" => array:3 [▶
"title" => "Additional information"
"priority" => 20
"callback" => "woocommerce_product_additional_information_tab"
]
"reviews" => array:3 [▶
"title" => "Reviews (0)"
"priority" => 30
"callback" => "comments_template"
]
]
Thanks.
Woah! I’m really loving the template/theme of this blog.
It’s simple, yet effective. A lot of times it’s tough to get
that “perfect balance” between user friendliness and visual appearance.
I must say that you’ve done a awesome job with this.
Additionally, the blog loads super fast for me on Safari.
Exceptional Blog!
Thank you.