I can add custom fields for my Woocommerce registration form, but how would I go about rearranging them with existing fields?
My default Woocommerce registration form has fields Username, Email and Password.
So if I add custom fields Phone, First Name and Last name with this code bellow they will appear before those default fields, but how can I change their order? For example I want to put Phone after password, but keep First and Last name to be first.
function wooc_extra_register_fields() {?>
<p class="form-row form-row-wide">
<label for="reg_billing_phone"><?php _e( 'Phone', 'woocommerce' ); ?></label>
<input type="text" class="input-text" name="billing_phone" id="reg_billing_phone" value="<?php esc_attr_e( $_POST['billing_phone'] ); ?>" />
</p>
<p class="form-row form-row-first">
<label for="reg_billing_first_name"><?php _e( 'First name', 'woocommerce' ); ?><span class="required">*</span></label>
<input type="text" class="input-text" name="billing_first_name" id="reg_billing_first_name" value="<?php if ( ! empty( $_POST['billing_first_name'] ) ) esc_attr_e( $_POST['billing_first_name'] ); ?>" />
</p>
<p class="form-row form-row-last">
<label for="reg_billing_last_name"><?php _e( 'Last name', 'woocommerce' ); ?><span class="required">*</span></label>
<input type="text" class="input-text" name="billing_last_name" id="reg_billing_last_name" value="<?php if ( ! empty( $_POST['billing_last_name'] ) ) esc_attr_e( $_POST['billing_last_name'] ); ?>" />
</p>
<div class="clear"></div>
<?php
}
add_action( 'woocommerce_register_form_start', 'wooc_extra_register_fields' );
2
Answers
I've just found out, you can change custom fields placement by using these hooks:
woocommerce_register_form_start – at the beginning of the form
woocommerce_register_form – before the “Register” button
woocommerce_register_form_end - after the “Register” button
You can rearrange checkout field by using below code put on functions.php file:
Change priority as you want