Add custom product tab at Woocommerce front end product page

Every Woocommerce product page contains at least two tabs, one is for Description and another is for Review. Here we are going to see how to add additional product tab, in case if you need one.

It is very simple though, you will have to hook to one Woocommerce template filter, that would be woocommerce_product_tabs and one call back handler which would used for rendering the tab content.

Here is the steps you need to follow.

function add_extra_product_tab( $tabs = array() ) {
	$tabs['wccpf_fields_tab'] = array(
		'title'    => "My Custom Tab",
		'priority' => 30,
		'callback' => 'render_custom_tab_content' 
	);
	return $tabs;
}

add_filter( 'woocommerce_product_tabs', 'add_extra_product_tab' );

Put the above snippet on your functions.php, this will add your custom tab header to the Product Tabs.

title this will be your tab header title
priority this property used to place your tab header, if you set this with 0 then your tab will be at the beginning ( Tab sequence goes like this 0, 10, 20, 30 … )
callback this property used to attach a call back handler for your tab, by using which your tab contents will be rendered.

function render_custom_tab_content() {
	echo '<h1>My custom tab content</h1>';	
}

As you might guessed the above snippet is the call back handler which display your custom tab content.

and here is the output

Happy Coding