Multi Select fields in Woocommerce backend Multi Select fields in Woocommerce backend wordpress wordpress

Multi Select fields in Woocommerce backend


To handle variable products for multi select fields is another thing and some changes need to be done to make it work. I have made 2 answers after below:

  1. The first one for product variations (for you)
  2. The other one for all other product types

So the main function that enable multi-select fields in WooCommerce backend will be:

function woocommerce_wp_multi_select( $field, $variation_id = 0 ) {    global $thepostid, $post;    if( $variation_id == 0 )        $the_id = empty( $thepostid ) ? $post->ID : $thepostid;    else        $the_id = $variation_id;    $field['class']         = isset( $field['class'] ) ? $field['class'] : 'select short';    $field['wrapper_class'] = isset( $field['wrapper_class'] ) ? $field['wrapper_class'] : '';    $field['name']          = isset( $field['name'] ) ? $field['name'] : $field['id'];    $meta_data              = maybe_unserialize( get_post_meta( $the_id, $field['id'], true ) );    $meta_data              = $meta_data ? $meta_data : array() ;    $field['value'] = isset( $field['value'] ) ? $field['value'] : $meta_data;    echo '<p class="form-field ' . esc_attr( $field['id'] ) . '_field ' . esc_attr( $field['wrapper_class'] ) . '"><label for="' . esc_attr( $field['id'] ) . '">' . wp_kses_post( $field['label'] ) . '</label><select id="' . esc_attr( $field['id'] ) . '" name="' . esc_attr( $field['name'] ) . '" class="' . esc_attr( $field['class'] ) . '" multiple="multiple">';    foreach ( $field['options'] as $key => $value ) {        echo '<option value="' . esc_attr( $key ) . '" ' . ( in_array( $key, $field['value'] ) ? 'selected="selected"' : '' ) . '>' . esc_html( $value ) . '</option>';    }    echo '</select> ';    if ( ! empty( $field['description'] ) ) {        if ( isset( $field['desc_tip'] ) && false !== $field['desc_tip'] ) {            echo '<img class="help_tip" data-tip="' . esc_attr( $field['description'] ) . '" src="' . esc_url( WC()->plugin_url() ) . '/assets/images/help.png" height="16" width="16" />';        } else {            echo '<span class="description">' . wp_kses_post( $field['description'] ) . '</span>';        }    }}

Code goes in function.php file of your active child theme (or active theme). This function, will handle now any type of products, including product variations.

Related: Multi checkbox fields in Woocommerce backend


1). For product variations (for you):

// Add custom multi-select fields in variation setting tabadd_action( 'woocommerce_product_after_variable_attributes', 'add_variation_settings_fields', 20, 3 );function add_variation_settings_fields( $loop, $variation_data, $variation_post ) {    woocommerce_wp_multi_select( array(        'id' => '_season',        'name' => '_season['.$loop.'][]',        'class' => '',        'label' => __('Season', 'woocommerce'),        'options' => array(            'spring' => __("Spring", "woocommerce"),            'summer' => __("Summer", "woocommerce"),            'autumn' => __("Autumn", "woocommerce"),            'winter' => __("Winter", "woocommerce"),        )    ), $variation_post->ID );}// Save custom multi-select fields for variationsadd_action( 'woocommerce_save_product_variation', 'save_variation_settings_fields', 10, 2 );function save_variation_settings_fields( $variation_id, $i ) {    if( isset( $_POST['_season'][$i] ) ){        $post_data = $_POST['_season'][$i];        // Multi data sanitization         $sanitize_data = array();        if( is_array($post_data) && sizeof($post_data) > 0 ){            foreach( $post_data as $value ){                $sanitize_data[] = esc_attr( $value );            }        }        update_post_meta( $variation_id, '_season', $sanitize_data );    }}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

enter image description here


2). For all other product types (except product variations, where we hide that custom field):

// Add custom fields for product general option settings (hidding it for variable products)add_action( 'woocommerce_product_options_general_product_data', 'add_custom_settings_fields', 20 );function add_custom_settings_fields() {    global $post;    echo '<div class="options_group hide_if_variable"">'; // Hidding in variable products    woocommerce_wp_multi_select( array(        'id' => '_season',        'name' => '_season[]',        'class' => '',        'label' => __('Season', 'woocommerce'),        'options' => array(            'spring' => __("Spring", "woocommerce"),            'summer' => __("Summer", "woocommerce"),            'autumn' => __("Autumn", "woocommerce"),            'winter' => __("Winter", "woocommerce"),        )    ) );    echo '</div>';}// Save custom multi-select fields to database when submitted in Backend (for all other product types)add_action( 'woocommerce_process_product_meta', 'save_product_options_custom_fields', 30, 1 );function save_product_options_custom_fields( $post_id ){    if( isset( $_POST['_season'] ) ){        $post_data = $_POST['_season'];        // Multi data sanitization         $sanitize_data = array();        if( is_array($post_data) && sizeof($post_data) > 0 ){            foreach( $post_data as $value ){                $sanitize_data[] = esc_attr( $value );            }        }        update_post_meta( $post_id, '_season', $sanitize_data );    }}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

enter image description here