My Account

WooCommerce Custom Select Field On Registration Form

Pre-Requisites

There are no pre-requisites in order for you to be able to implement this solution.

How To Implement This Solution?

Simply copy the pre-coded solution to your active theme’s functions.php or preferably the Code Snippets Plugin.

About this Solution

This guide shows you how to add a custom select field (drop-down list) to the registration form on the my account page. In this specific guide, we ask the user for their preferred holiday destination as our dummy example is in the context of a holiday website. You could use this code to implement a select field to capture customer information which will make your demographic data much richer.

				
					/**
 * Snippet Name:	WooCommerce Custom Select Field On Registration Form
 * Snippet Author:	ecommercehints.com
 */

// Create the new select drop down list field
add_action( 'woocommerce_register_form', 'ecommercehints_register_select_form_field' );
function ecommercehints_register_select_form_field() {
	woocommerce_form_field(
		'preferred_holiday_destination',
		array(
			'type'		=> 'select',
			'required'	=> true, // Shows an asterisk if true (*)
			'label'		=> 'Preferred Holiday Destination',
			'options'	=> array(
				''			=> 'Please select...',
				'London'	=> 'London', // 
				'Ibiza'		=> 'Ibiza'
			)
		),
		( isset($_POST['preferred_holiday_destination']) ? $_POST['preferred_holiday_destination'] : '' )
	);
}

// Show an error if select field is not filled out when registering
add_action( 'woocommerce_register_post', 'ecommercehints_validate_select_field', 10, 3 );
function ecommercehints_validate_select_field( $username, $email, $errors ) {
	if ( empty( $_POST['preferred_holiday_destination'] ) ) {
		$errors->add( 'preferred_holiday_destination_error', 'We need to store this information to send you the right offers!' );
	}
}

// Save the select field as User Meta
add_action( 'woocommerce_created_customer', 'ecommercehints_save_select_field' );
function ecommercehints_save_select_field( $customer_id ){
	if ( isset( $_POST['preferred_holiday_destination'] ) ) {
		update_user_meta( $customer_id, 'preferred_holiday_destination', wc_clean( $_POST['preferred_holiday_destination'] ) );
	}
}

// Show select field in the User Editor
add_action('show_user_profile', 'custom_user_profile_fields');
add_action('edit_user_profile', 'custom_user_profile_fields');

function custom_user_profile_fields( $user ) { ?>
<h2>Custom user meta fields</h2>
    <table class="form-table">
        <tr>
            <th>
                <label for="preferred_holiday_destination"><?php _e( 'Destination' ); ?></label>
            </th>
            <td>
                <input type="text" name="preferred_holiday_destination" id="preferred_holiday_destination" value="<?php echo esc_attr( get_the_author_meta( 'preferred_holiday_destination', $user->ID ) ); ?>" class="regular-text" />
            </td>
        </tr>
    </table>
<?php
}

// Save new select if edited by admin
add_action( 'personal_options_update', 'update_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'update_extra_profile_fields' );
function update_extra_profile_fields( $user_id ) {
    if ( current_user_can( 'edit_user', $user_id ) )
		update_user_meta( $customer_id, 'preferred_holiday_destination', wc_clean( $_POST['preferred_holiday_destination'] ) );
}