Editing product data tabs on WooCommerce Product Page

Editing product data tabs on WooCommerce Product Page

You need to add the code to your child theme’s functions.php file or via a plugin that allows custom functions to be added, such as the Code snippets plugin. Please don’t add custom code directly to your parent theme’s functions.php file as this will be wiped entirely when you update the theme.

Removing Tabs

Use the following snippet to remove specific tabs

<?php

/* Remove product data tabs */
add_filter( 'woocommerce_product_tabs', 'remove_product_tabs_callback', 98 );

function remove_product_tabs_callback( $tabs ) {

    unset( $tabs['description'] );      	// Remove the description tab
    unset( $tabs['reviews'] ); 			// Remove the reviews tab
    unset( $tabs['additional_information'] );  	// Remove the additional information tab

    return $tabs;
}

Renaming Tabs

Use the following snippet to rename tabs.

<?php

/* Rename product data tabs */
add_filter( 'woocommerce_product_tabs', 'rename_tabs_callback', 98 );

function rename_tabs_callback( $tabs ) {

	$tabs['description']['title'] = __( 'More Information' );		// Rename the description tab
	$tabs['reviews']['title'] = __( 'Ratings' );				// Rename the reviews tab
	$tabs['additional_information']['title'] = __( 'Product Data' );	// Rename the additional information tab

	return $tabs;

}

Re-ordering Tabs

Use the following snippet to change the tab order

<?php

/* Reorder product data tabs */
add_filter( 'woocommerce_product_tabs', 'reorder_tabs_callback', 98 );

function reorder_tabs_callback( $tabs ) {

	$tabs['reviews']['priority'] = 5;			// Reviews first
	$tabs['description']['priority'] = 10;			// Description second
	$tabs['additional_information']['priority'] = 15;	// Additional information third

	return $tabs;
}

Customize a tab

<?php

/* Customize product data tabs */
add_filter( 'woocommerce_product_tabs', 'custom_description_tab_callback', 98 );

function custom_description_tab_callback( $tabs ) {

	$tabs['description']['callback'] = 'woo_custom_description_tab_content';	// Custom description callback

	return $tabs;
}

function woo_custom_description_tab_content() {
	echo '<h2>Custom Description</h2>';
	echo '<p>Here\'s a custom description</p>';
}

Add a custom tab

Use the following snippet to add a custom global product tab

<?php

/* Add Ingredients tab */
function add_ingredients_product_tab_callback( $tabs ) {

	$tabs['ingredients_tab'] = array(
		'title'    => __( 'Ingredients', 'textdomain' ),
		'callback' => 'ingredients_tab_content_callback',
		'priority' => 50,
	);

	return $tabs;

}
add_filter( 'woocommerce_product_tabs', 'add_ingredients_product_tab_callback' );

/* Ingredients tab content */
function ingredients_tab_content_callback( $slug, $tab ) {
	?>
	<h2><?php echo wp_kses_post( $tab['title'] ); ?></h2>
	<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<?php
}

If you have custom field provided in your admin dashboard for your product, then the following code would be useful to achieve the required result.

<?php

/* Ingredients tab content */
function ingredients_tab_content_callback( $slug, $tab ) {
    ?>
	<h2><?php echo wp_kses_post( $tab['title'] ); ?></h2>
	<p><?php echo get_post_meta(get_the_ID(),'ingredients_information',true); ?></p>
	<?php
}

The Additional Information tab

Please note that the “Additional Information” tab will only show if the product has weight, dimensions or attributes (with “Visible on the product page” checked). If you try to apply a change to that tab and if the product does not have weight, dimensions or attribute, you will get an error message similar to :

Warning: call_user_func() expects parameter 1 to be a valid callback, no array or string given in /mysite/wp-content/plugins/woocommerce/templates/single-product/tabs/tabs.php on line 35

In that case, you have to use WooCommerce conditional tags:

  • has_attributes()
  • has_dimensions()
  • has_weight()
<?php

/**
 * Check if product has attributes, dimensions or weight to override the call_user_func() expects parameter 1 to be a valid callback error when changing the additional tab
 */
add_filter( 'woocommerce_product_tabs', 'additional_info_tabs_callback', 98 );

function additional_info_tabs_callback( $tabs ) {

	global $product;
	
	if( $product->has_attributes() || $product->has_dimensions() || $product->has_weight() ) { // Check if product has attributes, dimensions or weight
		$tabs['additional_information']['title'] = __( 'Product Data' );	// Rename the additional information tab
	}
 
	return $tabs;
 
}
Was this article helpful?
YesNo

Leave a comment

Your email address will not be published. Required fields are marked *