• Facebook Icon Link
    • Instagram Icon Link

    How to Edit WooCommerce Product Tabs.


    edit woocommerce product tabs

    Tutorial Overview.

    Do you ever find yourself needing to edit WooCommerce product tabs? WooCommerce comes with three default tabs on the product page: the Description tab, the Additional Information tab, and the Reviews tab. These are great but I have run into many situations where I needed to re-name, re-order, add or remove a tab on the WooCommerce product page. This tutorial will explain how to re-name, re-order, add, remove and edit WooCommerce product tabs.

    Quickies.

    woocommerce product tabs screenshot

    Where Do I Put the Code?

    You will be adding this code to the child theme’s functions.php file or a plugin that lets you add PHP functions. When making edits to the code in your WordPress website it is important that you do it in a child theme. This is so your edits don’t get overwritten when you update the main theme. For more info see: How to Make a WordPress Child Theme.

    A Note About the Additional Information Tab.

    This tab is conditional so it will only show if your product has dimensions, weight, or attributes. If the Additional Information tab is not active on a product you will get an error if you try to change it.

    How to Re-name WooCommerce Product Tabs.

    1. Copy and paste the code below into the functions.php file or a custom plugin.
    2. Enter the new name of the tab you want to change in the parentheses. The name in the square brackets below will be changed to the name in the parentheses. eg. The Description tab will change to Specifications.

    // Re-name product data tabs
    add_filter( 'woocommerce_product_tabs', 'rename_woo_tabs', 98 );
    
    function rename_woo_tabs( $tabs ) {
    
    	$tabs['description']['title'] = __( 'Specifications' );
    	$tabs['reviews']['title'] = __( 'Testimonials' );
    	$tabs['additional_information']['title'] = __( 'More Data' );
    
    	return $tabs;
    }
    

    How to Re-order WooCommerce Product Tabs.

    1. Copy and paste the code below into the functions.php file or a custom plugin.
    2. The tab with the lowest priority will be listed first.
    3. The tab with the highest priority will be listed last.
    4. If you added a custom tab you can also reorder that here.
    // Re-order product data tabs
    add_filter( 'woocommerce_product_tabs', 'reorder_woo_tabs', 98 );
    
    function reorder_woo_tabs( $tabs ) {
    $tabs['additional_information']['priority'] = 5;
    $tabs['reviews']['priority'] = 10;
    $tabs['description']['priority'] = 15;
    return $tabs;
    }
    

    How to add a Custom Tab to WooCommerce Product Tabs.

    1. Copy and paste the code below into the functions.php file or a custom plugin.
    2. This code will add a tab to the WooCommerce product tabs named New Tab.
    3. The new_product_tab_content function is where you add the content you want to appear in your tab.
    //Add a custom product data tab
    add_filter('woocommerce_product_tabs', 'new_woo_product_tab');
    
    function new_woo_product_tab($tabs){
      $tabs['new_tab'] = array(
        'title' => __( 'New Tab', 'woocommerce' ),
        'priority' => 50,
        'callback' => 'new_product_tab_content'
      );
      return $tabs;
    }
    
    function new_product_tab_content() {
      //content goes here
    echo 'New tab text goes here.';
    }
    

    How to Remove WooCommerce Product Tabs.

    1. Copy and paste the code below into the functions.php file or a custom plugin.
    2. Put the tab you want to remove into the square brackets.
    3. The unset function will remove whatever tab you specify.
    // Remove product data tabs
    add_filter( 'woocommerce_product_tabs', 'remove_woo_product_tabs', 98 );
    
    function remove_woo_product_tabs( $tabs ) {
        unset( $tabs['description'] );
        unset( $tabs['reviews'] );
        unset( $tabs['additional_information'] );
    
        return $tabs;
    }
    

     

    Additional Posts.

    Leave a Reply

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

    Pin It on Pinterest

    Share This