Add to collection
Md Riyazuddin

Md Riyazuddin

Verified

How to add WooCommerce Custom Tab Product Edit Page

In this post you know about that how to add tab in product edit page on WordPress admin and make your own customs thing which you would like to use.

So basically we are using two hooks in that which can represent our tab and tab panels lets jump in it. 

add_filter( 'woocommerce_product_data_tabs', 'wk_custom_product_tab' ); //this hooks create your tab only
function wk_custom_product_tab( $default_tabs ) {
    $default_tabs['custom_tab'] = array(   //here you can add you id of tab 
        'label'   =>  __( 'Custom Tab', 'domain' ),   //and you label of tab
        'target'  =>  'wk_custom_tab_data',  //here you can add your own  callback function to show your tab panels  and id
        'priority' => 60, //add you priority 
        'class'   => array()
    );
    return $default_tabs;
} 

add_action( 'woocommerce_product_data_panels', 'wk_custom_tab_data' ); // this is second hook which tell you to show your tab panels add your callback funtion in action callback


function wk_custom_tab_data() {  
   echo '<div id="wk_custom_tab_data" class="panel woocommerce_options_panel">// add content here</div>';//here you have to add your callback function which you give in first tab 
}

References and Credits

Tagged with: wordpress

Comments 0

  • Sorry!! No comment posted yet. Become the first user to give comment.
Add a comment

Would you like to write for w3 sniff?

Become part of an amazing group of contributors and authors and start writing for us

Join Now
add_filter( 'woocommerce_product_data_tabs', 'wk_custom_product_tab' ); //this hooks create your tab only
function wk_custom_product_tab( $default_tabs ) {
    $default_tabs['custom_tab'] = array(   //here you can add you id of tab 
        'label'   =>  __( 'Custom Tab', 'domain' ),   //and you label of tab
        'target'  =>  'wk_custom_tab_data',  //here you can add your own  callback function to show your tab panels  and id
        'priority' => 60, //add you priority 
        'class'   => array()
    );
    return $default_tabs;
} 

add_action( 'woocommerce_product_data_panels', 'wk_custom_tab_data' ); // this is second hook which tell you to show your tab panels add your callback funtion in action callback


function wk_custom_tab_data() {  
   echo '<div id="wk_custom_tab_data" class="panel woocommerce_options_panel">// add content here</div>';//here you have to add your callback function which you give in first tab 
}
Feedback submitted successfully.