Change postcode shipping field to a dropdown in Woocommerce

Question

Im trying to make the postcode field in shipping only to be a select type with my options in woocommerce checkout page:

1. Unsetting shipping state and post code checkout fields

   add_filter( 'woocommerce_checkout_fields' , 'partial_unsetting_checkout_fields' );
   function partial_unsetting_checkout_fields( $fields ) {
        unset($fields['shipping']['woocommerce_checkout_fields']);
        return $fields;
   }  
   

2. Reinserting custom shipping post code checkout field,

   add_filter( 'woocommerce_checkout_fields' , 'art_override_default_address_fields' );
   function art_override_default_address_fields( $fields ) {
       $fields['shipping_postcode']['type'] = 'select';
       $fields['shipping_postcode']['class'] = array('form-row-wide');
       $fields['shipping_postcode']['required'] = true;
       $fields['shipping_postcode']['label'] = __('Postcode', 'my_theme_slug');
       $fields['shipping_postcode']['placeholder'] = __('Enter Postcode', 'my_theme_slug');
       $fields['shipping_postcode']['default'] ='Choice 1';
       $fields['shipping_postcode']['options'] = array(
           'option_1' => 'Choice 1',
           'option_2' => 'Choice 2',
           'option_3' => 'Choice 3'
       );
   } 
   

How to convert billing postcode to a select field with custom options?

Answer 1

There is multiple ways to do it:

1) For shipping postcode field only, you will use the following:

add_filter( 'woocommerce_shipping_fields' , 'customize_shipping_postcode_field' );
function customize_shipping_postcode_field( $shipping_fields ) {

    $shipping_fields['shipping_postcode']['type'] = 'select';
    $shipping_fields['shipping_postcode']['options'] = array(
        ''         => __('Select your postcode', 'woocommerce'),
        'option_1' => 'Choice 1',
        'option_2' => 'Choice 2',
        'option_3' => 'Choice 3'
    );

    return $shipping_fields;
}

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

---

2) For billing and shipping postcode fields, you can use that instead:

add_filter( 'woocommerce_default_address_fields' , 'customize_postcode_fields' );
function customize_postcode_fields( $adresses_fields ) {

    $adresses_fields['postcode']['type'] = 'select';
    $adresses_fields['postcode']['options'] = array(
        ''         => __('Select your postcode', 'woocommerce'),
        'option_1' => 'Choice 1',
        'option_2' => 'Choice 2',
        'option_3' => 'Choice 3'
    );

    return $adresses_fields;
}

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

---