Change order of Address Fields in Checkout

Sometimes depending on the country, the order of the address fields is important. So they need to be on a specific order. Let's see how you can easily re-order the address fields in checkout.

By default you can see the order of the address fields on the table customer_eav_attribute.

This order is sometimes overridden in the checkout layout xml, checkout_index_index.xml.

For example in line 226, you can see that the sort order of the country_id is set to 115, meaning that the default sort order of the country_id that was 90 in the db is overridden. That would be a way to override the default sort order of the address fields. But let's see another way that can be used for reordering both shipping and billing address fields in checkout, and it's by using a Magento plugin. We have to create a plugin for the function process() of the class LayoutProcessor, which is responsible of bringing the fields in checkout. What we would try to achieve in our example is to position the telephone field right after the street fields.

We declare our plugin

And the afterProcess() function

As you can see above, for the billing address we had to add a check depending on the checkout configuration in admin about where to dispaly the billing address, on payment method or payment page, as then the array keys are different.

So the shipping address fields will be shown like below in checkout.

The full example as extension can be found here.

Feel free to share this post and ask your questions in the comments below.

Till next time!

DigitalOcean Referral Badge