Customizing Woocommerce template my-account/form-edit-addresses - php

Question

Having some issues with the address area of /my-account/edit-addresses/
I would like to customize the form fields within the template form-edit-addresses.php. For example, I would like to change for all the fields, plus individually place some within separate classes:
<p class="form-row form-row-first validate-required" id="billing_first_name_field" data-priority="10">
<label for="billing_first_name" class="">First name <abbr class="required" title="required">*</abbr></label>
<input type="text" class="input-text " name="billing_first_name" id="billing_first_name" placeholder="" value="Name"></p>
to
<div class="form-group form-group-default input-group">
<div class="form-input-group">
<label for="billing_first_name" class="">Company</label>
<input type="text" class="input-text " name="billing_first_name" id="billing_first_name" placeholder="" value="Name">
</div>
Please note that these above are just the HTML tags taken from the inspect and are not the correct fields as to make the form work. That I can handle - it's just finding or replacing the fields.
The second thing I would like to accomplish is to add this form within the /my-account/edit-addresses/ URL/Slug rather than /my-account/edit-addresses/billing
The third is to make the form upon submitting redirect to /my-account/ instead of /my-account/edit-addresses/ and include any Woocommerce notices
The last point is to remove the First Name Last Name Email Phone fields. I assume will fix easily by completing step 1 and removing the form fields that are not required.
Greatly appreciate any time given to finding solutions to these.
Cheers

Answer 1

I have figured out part 2, 3 and 4 of my question - just in case someone else was looking...
Part 2 was to add the form-edit-address.php to edit-address
I added this to the my-address.php template
<?php
// get the user meta
$userMeta = get_user_meta(get_current_user_id());
// get the form fields
$countries = new WC_Countries();
$billing_fields = $countries->get_address_fields( '', 'billing_' );
$shipping_fields = $countries->get_address_fields( '', 'shipping_' );
?>
<!-- billing form -->
<?php
$load_address = 'billing';
$page_title = __( 'Billing Address', 'woocommerce' );
?>
<form action="/my-account/edit-address/billing/" class="edit-account" method="post">
<h2><?php echo apply_filters( 'woocommerce_my_account_edit_address_title', $page_title ); ?></h2>
<?php do_action( "woocommerce_before_edit_address_form_{$load_address}" ); ?>
<?php foreach ( $billing_fields as $key => $field ) : ?>
<?php woocommerce_form_field( $key, $field, $userMeta[$key][0] ); ?>
<?php endforeach; ?>
<?php do_action( "woocommerce_after_edit_address_form_{$load_address}" ); ?>
<p>
<input type="submit" class="button" name="save_address" value="<?php esc_attr_e( 'Save Address', 'woocommerce' ); ?>" />
<?php wp_nonce_field( 'woocommerce-edit_address' ); ?>
<input type="hidden" name="action" value="edit_address" />
</p>
</form>
To do part 3 and redirect submit from form-edit-address.php I added the following to my theme functions.php
function action_woocommerce_customer_save_address( $user_id, $load_address ) {
wp_safe_redirect(wc_get_page_permalink('myaccount'));
exit;
};
add_action( 'woocommerce_customer_save_address', 'action_woocommerce_customer_save_address', 99, 2 );
To do part 4 and remove fields from the form-edit-address.php I added the following to my theme functions.php
add_filter( 'woocommerce_billing_fields' , 'custom_override_billing_fields' );
function custom_override_billing_fields( $fields ) {
unset($fields['billing_first_name']);
unset($fields['billing_last_name']);
unset($fields['billing_phone']);
unset($fields['billing_email']);
return $fields;
}
Any help with the other part of this question would be greatly appreciated.

Answer 2

You can NOT change the <p> tag (removing all existing attributes + values) to a <div> as will certainly break some processes, because specific woocommerce javascript is enabled on this…
Now you can use woocommerce_form_field_args filter hook to change the class globally on all the <p> tags and you can remove the required behavior on all the fields too, so <abbr class="required" title="required">*</abbr> will be removed.
Here is that code:
add_filter( 'woocommerce_form_field_args', 'custom_wc_form_field_args', 10, 3 );
function custom_wc_form_field_args( $args, $key, $value ){
// Only on My account > Edit Adresses
if( is_wc_endpoint_url( 'edit-account' ) || is_checkout() ) return $args;
$args['class'] = array('form-input-group');
$args['required'] = false;
return $args;
}
So you will have to manage CSS to make design changes.
All available arguments $args in this array are:
'type' # # string
'label' # # string
'description' # # string
'placeholder' # # string
'maxlength' # # boolean
'required' # # boolean
'autocomplete' # # boolean
'id' # => $key (argument)
'class' # # array
'label_class' # # array
'input_class' # # array
'return' # # boolean
'options' # # array
'custom_attributes' # # array
'validate' # # array
'default' # # string
'autofocus' # # string
'priority' # # string
With woocommerce_form_field_{field_type} filter hook you can access to field settings individually based on the field type. This hook has 4 available arguments: $field, $key, $args and $value…