Add new tab in add product page

Sometimes it is needed for our users to add new tab in the “Add Product” page. This blog is to help them how to add the custom field, save the value and display that in the Single Product Page also.

Custom add-ons fields
The first code snippet is to add a new custom tab in the add product page. Here I named this custom tab as “Delivery Time”. You can change the name of the tab by using label.

/**	* Add Custom Tab in add product page.	
* @author WC Marketplace	* @Version 3.3.0	
*/	
function add_custom_product_data_tabs( $tabs ) 
{	   
$tabs['advanced'] = array
('label'=> __( 'Delivery Time', 'your-text-domain' ),	       
'target'   => 'custom_tab_product_data',
'class'=> array(),
'priority' => 100,	   
);	   
return $tabs;	
}	
add_filter( 'mvx_product_data_tabs', 'add_custom_product_data_tabs' );

Now, to add content inside the custom tab, use the following code. Here I have added a field called “Estimated Delivery time”, that will ask the vendor to put value.

/*** Add Custom Tab content in add product page.	
* @author WC Marketplace	
* @Version 3.3.0	
*/	
function add_custom_product_data_content( $pro_class_obj, $product, $post ) 
{	  
$hh = get_post_meta($product->get_id() , '_custom_text_field' );	    
?>	   
<div role="tabpanel" class="tab-pane fade" id="custom_tab_product_data"><!-- just make sure tabpanel id should replace with your added tab target -->	       
<div class="row-padding">	           
<div class="form-group">	               
<label class="control-label col-sm-3 col-md-3">Estimated Delivery time</label>	               <div class="col-md-6 col-sm-9">	                   
<input type="text" name="custom_text_field" class="form-control" value= <?php print_r($hh[0]) ?> />	               
</div>	           
</div>	       
</div>	   
</div>	   
<?php	
}	
add_action( 'mvx_product_tabs_content', 'add_custom_product_data_content', 10, 3 );

Leave a Reply