Change the Billing fields position in CheckoutWC

In the WooCommerce standard checkout form, you are first asked for personal details like First Name, Last Name, Email Address, etc. Then, immediately you are asked to fill up the Billing Address. That’s nice in some cases, but it can be improved.

CheckoutWC, by design, changes this behavior by switching priorities between the Billing Address and Shipping Address, being the Shipping Address the first option right after the customer’s personal details.

The not-so-good thing is that, by default, it sends the Billing Address option right to the last step.

And there aren’t any options in the CheckoutWC settings to customize the field position.

However, it can still be changed with a bit of code.

So first things first, you need to identify where the Billing Address fields are on the checkout page.

Then, decide on a place to move it.

For this example, let’s move the Billing Address fields to the first step in the checkout page, which is the Information tab.

The destination place will be right below the Shipping Address.

Let’s lay out the steps you need to make the change.

First, “unhook” the Billing Address fields from the Payment tab.

remove_action( 'cfw_checkout_payment_method_tab', 'cfw_payment_tab_content_billing_address', 20 ); 

Second, hook it after the Shipping Address.

add_action( 'cfw_checkout_after_shipping_address', 'cfw_payment_tab_content_billing_address' );

That’s all! It’s that simple.