wordpress - Reorder Woocommerce checkout fields

Question

I am trying to reorder the billing fields on the checkout page but everything I tried so far is not working.

Here is the snippet I am currently trying:

add_filter("woocommerce_checkout_fields", "order_fields");

function order_fields($fields) {
  $order = array(
    "billing_first_name", 
    "billing_last_name", 
    "billing_country", 
    "billing_state", 
    "billing_address_1", 
    "billing_address_2", 
    "billing_email", 
    "billing_phone"
  );

  foreach($order as $field) {
    $ordered_fields[$field] = $fields["billing"][$field];
  }

  $fields["billing"] = $ordered_fields;
  return $fields;
}

Could something be overriding this snippet, because it used to work for me.

Answer 1

The method you are using no longer works (since the WooCommerce 3.0.4 update - link to github issue here). It's not exactly a bug, but rather a change of spec.

To fix this, you simply need to adjust the priority of each of the fields to fit the order that you want.

add_filter("woocommerce_checkout_fields", "custom_override_checkout_fields", 1);
function custom_override_checkout_fields($fields) {
    $fields['billing']['billing_first_name']['priority'] = 1;
    $fields['billing']['billing_last_name']['priority'] = 2;
    $fields['billing']['billing_company']['priority'] = 3;
    $fields['billing']['billing_country']['priority'] = 4;
    $fields['billing']['billing_state']['priority'] = 5;
    $fields['billing']['billing_address_1']['priority'] = 6;
    $fields['billing']['billing_address_2']['priority'] = 7;
    $fields['billing']['billing_city']['priority'] = 8;
    $fields['billing']['billing_postcode']['priority'] = 9;
    $fields['billing']['billing_email']['priority'] = 10;
    $fields['billing']['billing_phone']['priority'] = 11;
    return $fields;
}

add_filter( 'woocommerce_default_address_fields', 'custom_override_default_locale_fields' );
function custom_override_default_locale_fields( $fields ) {
    $fields['state']['priority'] = 5;
    $fields['address_1']['priority'] = 6;
    $fields['address_2']['priority'] = 7;
    return $fields;
}

Please note that it's not the line in code that adjusts the placement in the order, but the priority assigned to the field. In this case, I changed the ['billing_state'] priority to 5 which is (in this example) after ['billing_country'] and before ['billing_address_1'].

---

EDIT:

As per the comments, this wasn't working for some reason (it worked on my first test WooCommerce installation, but I managed to get it to fail after changing the store location).

After some digging, I found that the default locale settings get applied on top of the override (not sure how else to explain this, but bear with me).

I managed to get an install running where the above code was not working, and managed to fix it by adding the following code as well:

add_filter( 'woocommerce_default_address_fields', 'custom_override_default_locale_fields' );
function custom_override_default_locale_fields( $fields ) {
    $fields['state']['priority'] = 5;
    $fields['address_1']['priority'] = 6;
    $fields['address_2']['priority'] = 7;
    return $fields;
}

I have added the extra snippet to the first code block to validate the entire block.