Talking about UX optimization, the WooCommerce checkout is where you should focus most of your time. The checkout page of an ecommerce website is one of the main reasons for shopping cart abandonment – additional hidden charges, lack of trust, confusion and also, too many fields to fill out.

Today, we will see how to turn the “Address 2” field into a dropdown. This is if you sell to specific areas and you want to minimize the writing time – why not let customers pick from a list instead?

Turn the WooCommerce checkout address field into a dropdown select

PHP Snippet: Turn Address Checkout Field Into Drop-down – WooCommerce


/**
* @snippet Turn Address Checkout Field Into Drop-down  - WooCommerce
* @how-to Get CustomizeWoo.com FREE
* @sourcecode https://businessbloomer.com/?p=73350
* @author Rodolfo Melogli
* @testedwith WooCommerce 3.2.5
*/

add_filter( 'woocommerce_default_address_fields' , 'bbloomer_address_field_dropdown' );

function bbloomer_address_field_dropdown( $address_fields ) {

    $location_array = array(
		'Location 1' => 'Location 1',
		'Location 2' => 'Location 2',
		'Location 3' => 'Location 3',
		'Location 4' => 'Location 4',
    );

$address_fields['address_2']['label'] = 'Location';
$address_fields['address_2']['type'] = 'select';
$address_fields['address_2']['options'] = $location_array;

return $address_fields;

}

Share:

Leave a Reply