Last active
February 3, 2018 03:34
-
-
Save alexmustin/959bf52abf6e5b7eecc9afab84079f9c to your computer and use it in GitHub Desktop.
WooCommerce - Create new Admin Product Data Tab
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?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