How to Move the Email Field to the Top of WooCommerce Checkout

How to Move the Email Field to the Top of WooCommerce Checkout
On this page
  1. Why Put Email First at Checkout
  2. Step 1: Change the Email Field's Priority
  3. Troubleshooting
  4. Frequently Asked Questions
  5. Conclusion

You can move the email field to the top of WooCommerce checkout by changing its priority value inside the woocommerce_billing_fields filter — no drag-and-drop field editor required, just one small snippet.

Why Put Email First at Checkout

  • Capturing the email address early means you can trigger cart-recovery emails even if the shopper abandons before finishing the form
  • You can check the email against existing customers earlier and pre-fill known details
  • It matches the pattern shoppers expect from most modern checkout flows

Step 1: Change the Email Field’s Priority

Every checkout field has a numeric priority that controls its position. Lowering the billing email field’s priority to 1 puts it ahead of every other billing field.

PHP
/** Move billing email to the very top of the checkout billing fields */
add_filter( 'woocommerce_billing_fields', 'reorder_billing_email_first' );

function reorder_billing_email_first( $fields ) {
    $fields['billing_email']['priority'] = 1;
    return $fields;
}
Move the email field to the top of WooCommerce checkout: the page before adding the code
Before
Move the email field to the top of WooCommerce checkout: the page after adding the code
After

Moving Phone Number Next to Email

If you want phone number to follow directly after email rather than at the end of the form, give it the next priority value.

PHP
/** Keep billing phone directly under the email field */
add_filter( 'woocommerce_billing_fields', 'reorder_billing_phone_after_email' );

function reorder_billing_phone_after_email( $fields ) {
    $fields['billing_phone']['priority'] = 5;
    return $fields;
}

Troubleshooting

Email moves but another field jumps ahead of it unexpectedly

Check the priority values of the fields around it — if two fields share the same or a lower priority number, their order can look inconsistent. Space out priorities (1, 5, 10, 15…) to leave room for later adjustments.

A checkout field editor plugin overrides this change

Some checkout field editor plugins load their own field order after this filter runs. Check the plugin’s field order settings first before troubleshooting the snippet itself.

Frequently Asked Questions

Does moving the email field affect where it’s saved in the order?

No, priority only changes the on-screen field order, not how or where the value is stored on the order.

Can I also move the account password field next to email?

Yes, the account password field lives in the “account” field group rather than “billing” — you’ll need woocommerce_checkout_fields to reorder it alongside billing fields.

Will this work on block-based checkout?

The classic checkout shortcode responds to this filter; the newer block-based checkout uses its own field ordering via the block editor and Store API instead.

This same priority-based technique is worth remembering beyond checkout — any time you need to move the email field to the top of WooCommerce checkout or reorder any other billing field, adjusting its priority value is almost always simpler than a full field-editor plugin.

Conclusion

Changing one priority number is all it takes to move the email field to the top of WooCommerce checkout, making it easier to capture an address early and match the flow shoppers already expect.

See also How to Move and Reorder Checkout Fields in WooCommerce. Then read How to Move Labels Inside WooCommerce Checkout Fields.

Prefer no code? All-in-One Utilities Woo Add-on adds over 50 WooCommerce features, so you can switch them on without code.

Leave a Reply

Schedule a call