Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
WooCommerce - Create new Admin Product Data Tab
<?php
/* CREATE THE NEW CUSTOM TAB
---------------------------------------------------- */
// First Register the Tab by hooking into the 'woocommerce_product_data_tabs' filter
add_filter( 'woocommerce_product_data_tabs', 'add_my_custom_product_data_tab' );
function add_my_custom_product_data_tab( $product_data_tabs ) {
$product_data_tabs['my-custom-tab'] = array(
'label' => __( 'My Custom Tab', 'woocommerce' ),
'target' => 'my_custom_product_data',
'class' => array( 'show_if_simple' ),
);
return $product_data_tabs;
}
/** CSS To Add Custom tab Icon */
function wcpp_custom_style() {
?>
<style>
#woocommerce-product-data ul.wc-tabs li.my-custom-tab_options a:before { font-family: WooCommerce; content: '\e006'; }
</style>
<?php
}
add_action( 'admin_head', 'wcpp_custom_style' );
/* ADD FIELDS TO THE NEW CUSTOM TAB
---------------------------------------------------- */
// functions you can call to output text boxes, select boxes, etc.
add_action('woocommerce_product_data_panels', 'woocom_custom_product_data_fields');
function woocom_custom_product_data_fields() {
global $post;
// Note the 'id' attribute needs to match the 'target' parameter set above
?>
<div id='my_custom_product_data' class='panel woocommerce_options_panel'>
<div class = 'options_group' >
<?php
// Text Field
woocommerce_wp_text_input(
array(
'id' => '_text_field',
'label' => __( 'Custom Text Field', 'woocommerce' ),
'wrapper_class' => 'show_if_simple', //show_if_simple or show_if_variable
'placeholder' => 'Custom text field',
'desc_tip' => 'true',
'description' => __( 'Enter the custom value here.', 'woocommerce' )
)
);
// Number Field
woocommerce_wp_text_input(
array(
'id' => '_number_field',
'label' => __( 'Custom Number Field', 'woocommerce' ),
'placeholder' => '',
'description' => __( 'Enter the custom value here.', 'woocommerce' ),
'type' => 'number',
'custom_attributes' => array(
'step' => 'any',
'min' => '15'
)
)
);
// Checkbox
woocommerce_wp_checkbox(
array(
'id' => '_checkbox',
'label' => __('Custom Checkbox Field', 'woocommerce' ),
'description' => __( 'Check me!', 'woocommerce' )
)
);
// Select
woocommerce_wp_select(
array(
'id' => '_select',
'label' => __( 'Custom Select Field', 'woocommerce' ),
'options' => array(
'one' => __( 'Custom Option 1', 'woocommerce' ),
'two' => __( 'Custom Option 2', 'woocommerce' ),
'three' => __( 'Custom Option 3', 'woocommerce' )
)
)
);
// Textarea
woocommerce_wp_textarea_input(
array(
'id' => '_textarea',
'label' => __( 'Custom Textarea', 'woocommerce' ),
'placeholder' => '',
'description' => __( 'Enter the value here.', 'woocommerce' )
)
);
?>
</div>
</div>
<?php
}
/** Hook callback function to save custom fields information */
function woocom_save_proddata_custom_fields($post_id) {
// Save Text Field
$text_field = $_POST['_text_field'];
if (!empty($text_field)) {
update_post_meta($post_id, '_text_field', esc_attr($text_field));
}
// Save Number Field
$number_field = $_POST['_number_field'];
if (!empty($number_field)) {
update_post_meta($post_id, '_number_field', esc_attr($number_field));
}
// Save Textarea
$textarea = $_POST['_textarea'];
if (!empty($textarea)) {
update_post_meta($post_id, '_textarea', esc_html($textarea));
}
// Save Select
$select = $_POST['_select'];
if (!empty($select)) {
update_post_meta($post_id, '_select', esc_attr($select));
}
// Save Checkbox
$checkbox = isset($_POST['_checkbox']) ? 'yes' : 'no';
update_post_meta($post_id, '_checkbox', $checkbox);
// Save Hidden field
$hidden = $_POST['_hidden_field'];
if (!empty($hidden)) {
update_post_meta($post_id, '_hidden_field', esc_attr($hidden));
}
}
add_action( 'woocommerce_process_product_meta_simple', 'woocom_save_proddata_custom_fields' );
// You can uncomment the following line if you wish to use those fields for "Variable Product Type"
//add_action( 'woocommerce_process_product_meta_variable', 'woocom_save_proddata_custom_fields' );
/* REPOSITION THE TAB
---------------------------------------------------- */
function woocom_custom_product_data_tab( $original_prodata_tabs) {
$new_custom_tab['my-custom-tab'] = array(
'label' => __( 'My Custom Tab', 'woocommerce' ),
'target' => 'my_custom_product_data_tab',
'class' => array( 'show_if_simple', 'show_if_variable' ),
);
$insert_at_position = 2; // Change this for desire position
$tabs = array_slice( $original_prodata_tabs, 0, $insert_at_position, true ); // First part of original tabs
$tabs = array_merge( $tabs, $new_custom_tab ); // Add new
$tabs = array_merge( $tabs, array_slice( $original_prodata_tabs, $insert_at_position, null, true ) ); // Glue the second part of original
return $tabs;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment