Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
How To Add Woocommerce Custom Product Fields | http://www.ibenic.com/how-to-add-woocommerce-custom-product-fields
<?php
// @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/wc-meta-box-functions.php#L141
$args = array(
'label' => '', // Text in Label
'class' => '',
'style' => '',
'wrapper_class' => '',
'value' => '', // if empty, retrieved from post meta where id is the meta_key
'id' => '', // required
'name' => '', //name will set from id if empty
'cbvalue' => '',
'desc_tip' => '',
'custom_attributes' => '', // array of attributes
'description' => ''
);
woocommerce_wp_checkbox( $args );
<?php
/**
* Show or hide tabs or sections or single option fields for specific product types
*
* Use some of these classes :
* show_if_simple
* show_if_grouped
* show_if_external
* show_if_variable
* show_if_virtual
* show_if_downloadable
**/
<?php
/**
* General tab (priority 10) options group
*
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-general.php
*
* woocommerce_product_options_pricing
* woocommerce_product_options_downloads
* woocommerce_product_options_tax
**/
add_action( 'woocommerce_product_options_pricing', 'my_woo_custom_price_field' );
/**
* Add a Christmas Price field to pricing options group
**/
function my_woo_custom_price_field() {
$field = array(
'id' => 'christmas_price',
'label' => __( 'Christmas Price', 'textdomain' ),
'data_type' => 'price' //Let WooCommerce formats our field as price field
);
woocommerce_wp_text_input( $field );
}
add_action( 'woocommerce_product_options_general_product_data', 'my_woo_custom_fields' );
/**
* Add a select Field in a new general options group
*/
function my_woo_custom_fields() {
echo '<div class="options_group">';
$select_field = array(
'id' => 'my_select',
'label' => __( 'Custom Select', 'textdomain' ),
'options' => array(
'value1' => __( 'Text 1', 'textdomain' ),
'value2' => __( 'Text 2', 'textdomain' )
)
);
woocommerce_wp_select( $select_field );
echo '</div>';
}
<?php
// @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/wc-meta-box-functions.php#L81
$args = array(
'value' => '',
'class' => '',
'id' => ''
);
woocommerce_wp_hidden_input( $args );
<?php
/**
* In addition to general tab (priority 10), here are the other default tabs :
*
* Inventory tab - Priority 20
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-inventory.php
* First group :
* under stock sku settings – woocommerce_product_options_sku,
* under manage stocks settings – woocommerce_product_options_stock,
* under low stock threshold settings – woocommerce_product_options_stock_fields,
* under stock status settings – woocommerce_product_options_stock_status,
* Second group – woocommerce_product_options_sold_individually.
* Or add your custom group with woocommerce_product_options_inventory_product_data
*
*
* Shipping tab - Priority 30
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-shipping.php
* First group with product dimension – woocommerce_product_options_dimensions,
* Second group – woocommerce_product_options_shipping.
* Here is no hook for your custom options group 😱 but if you absolutely need it, you can do some tricks
* with the second hook and closing </div> element :
**/
add_action( 'woocommerce_product_options_shipping', 'my_woo_product_options_shipping_product_data' );
function my_woo_product_options_shipping_product_data() {
echo '</div>';
echo '<div class="options_group">';
echo 'here is my new options group content...';
}
/**
* Linked products tab - Priority 40
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-linked-products.php
* Add your custom group with woocommerce_product_options_related
*
*
* Attributes tab - Priority 50
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-attributes.php
* Add your custom group with woocommerce_product_options_attributes
*
*
* Variations tab - Priority 60
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-variations.php
* Add your custom group with woocommerce_variable_product_before_variations
* Add bulk edit options - woocommerce_variable_product_bulk_edit_actions
*
*
* Advanced tab - Priority 70
* @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/meta-boxes/views/html-product-data-advanced.php
* Reviews option group – woocommerce_product_options_reviews
* Add your custom group with woocommerce_product_options_advanced
**/
<?php
// @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/wc-meta-box-functions.php#L241
$args = array(
'label' => '', // Text in Label
'class' => '',
'style' => '',
'wrapper_class' => '',
'value' => '', // if empty, retrieved from post meta where id is the meta_key
'id' => '', // required
'name' => '', //name will set from id if empty
'options' => '', // Options for radio inputs, array
'desc_tip' => '',
'description' => ''
);
woocommerce_wp_radio( $args );
<?php
add_action( 'woocommerce_process_product_meta', 'save_custom_field' );
function save_custom_field( $post_id ) {
$custom_field_value = isset( $_POST['my_custom_input'] ) ? $_POST['my_custom_input'] : '';
$product = wc_get_product( $post_id );
$product->update_meta_data( 'my_custom_input', $custom_field_value );
$product->save();
}
<?php
// @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/wc-meta-box-functions.php#L184
$args = array(
'label' => '', // Text in Label
'class' => '',
'style' => '',
'wrapper_class' => '',
'value' => '', // if empty, retrieved from post meta where id is the meta_key
'id' => '', // required
'name' => '', //name will set from id if empty
'options' => '', // Options for select, array
'desc_tip' => '',
'custom_attributes' => '', // array of attributes
'description' => ''
);
woocommerce_wp_select( $args );
<?php
add_action( 'woocommerce_product_write_panel_tabs', 'my_custom_tab_action' );
/**
* Adding a custom tab
*/
function my_custom_tab_action() {
?>
<li class="custom_tab">
<a href="#the_custom_panel">
<span><?php _e( 'My Custom Tab', 'textdomain' ); ?></span>
</a>
</li>
<?php
}
<?php
add_filter( 'woocommerce_product_data_tabs', 'my_custom_tab' );
/**
* Adding a custom tab
*/
function my_custom_tab( $tabs ) {
$tabs['custom_tab'] = array(
'label' => __( 'My Custom Tab', 'textdomain' ),
'target' => 'the_custom_panel',
'class' => array(),
'priority' => 21, // general: 10, inventory: 20, shipping: 30, linked product: 40, attribute: 50, variations: 60, advanced: 70
);
return $tabs;
}
add_action( 'admin_head', 'my_custom_tab_css_icon' );
/**
* Custom tab icon
*
* @link https://developer.wordpress.org/resource/dashicons/
*/
function my_custom_tab_css_icon(){
echo '<style>#woocommerce-product-data ul.wc-tabs li.custom_tab_options a::before{content: "\f487";}</style>';
}
<?php
add_action( 'woocommerce_product_data_panels', 'custom_tab_panel' );
function custom_tab_panel() {
?>
<div id="the_custom_panel" class="panel woocommerce_options_panel">
<div class="options_group">
<?php
$field = array(
'id' => 'my_custom_input',
'label' => __( 'Custom Input', 'textdomain' ),
);
woocommerce_wp_text_input( $field );
?>
</div>
</div>
<?php
}
<?php
// @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/wc-meta-box-functions.php#L14
$args = array(
'label' => '', // Text in Label
'placeholder' => '',
'class' => '',
'style' => '',
'wrapper_class' => '',
'value' => '', // if empty, retrieved from post meta where id is the meta_key
'id' => '', // required
'name' => '', //name will set from id if empty
'type' => '',
'desc_tip' => '',
'data_type' => '',
'custom_attributes' => '', // array of attributes
'description' => ''
);
woocommerce_wp_text_input( $args );
<?php
// @link https://github.com/woocommerce/woocommerce/blob/master/includes/admin/wc-meta-box-functions.php#L96
$args = array(
'label' => '', // Text in Label
'placeholder' => '',
'class' => '',
'style' => '',
'wrapper_class' => '',
'value' => '', // if empty, retrieved from post meta where id is the meta_key
'id' => '', // required
'name' => '', //name will set from id if empty
'rows' => '',
'cols' => '',
'desc_tip' => '',
'custom_attributes' => '', // array of attributes
'description' => ''
);
woocommerce_wp_textarea_input( $args );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment