Home » WooCommerce: Move Email Field to Top @ Checkout

WooCommerce: Move Email Field to Top @ Checkout

by Tutor Aspire

This tutorial is a spin-off of a previous article (WooCommerce: Move / Reorder Checkout Fields) as I feel there is a huge boost of requests for this task alone.

Moving the billing email field to the top of the WooCommerce checkout gives you many benefits: because it’s the first field customers need to fill out, you can capture their email address (upon marketing permission) and send them cart reminders, feedback requests and similar if they do not complete the checkout.

Also, having the email first can make you save time in case the user is already registered, and you could save them time while checking this against the list of customers, so a prompt can be displayed to load all their billing/shipping details for example.

Either way, it’s super easy to move the email field to the top. Enjoy!

Moving the Billing Email checkout field to the top couldn’t be easier!

PHP Snippet: Move Billing Email Field to Top @ WooCommerce Checkout

/**
 * @snippet       Move Email Field To Top @ Checkout Page
 * @how-to        Get tutoraspire.com FREE
 * @author        Tutor Aspire
 * @compatible    Woo 4.9
 * @donate $9     https://www.tutoraspire.com
 */
 
add_filter( 'woocommerce_billing_fields', 'tutoraspire_move_checkout_email_field' );

function tutoraspire_move_checkout_email_field( $address_fields ) {
    $address_fields['billing_email']['priority'] = 1;
    return $address_fields;
}

You may also like