My Account Fields

First of all we will make one of the edit account default fields optional, then we are going to remove it completely and after that I will show how to add a custom field there.

/2 comments

Making Fields Not Required

For example I do not want the “Last name” to be required here, I can easily make it optional (or any other field) with the code below:

add_filter('woocommerce_save_account_details_required_fields', 'misha_myaccount_required_fields');
 
function misha_myaccount_required_fields( $account_fields ) {
 
	unset( $account_fields['account_last_name'] );
 
	// unset( $account_fields['account_first_name'] ); // First name
	// unset( $account_fields['account_display_name'] ); // Display name
 
	return $required_fields;
 
}

Have you inserted the code to your functions.php? Done! The “Last name” field is not required any more.

Wait… But… The required field asterisk is still there! 🤔

Required first name and last name fields on WooCommerce My Account page

I am not trying to fool you guys, try to remove the last name and hit the save button. It it saved? Absolutely.

And yes, I have bad news about the field asterisk… It is hardcoded!!! Okay, okay… Replacing form-edit-account.php template just because of this asterisk definitely doesn’t seem like a good idea.

In this situation I think the best idea is to use CSS.

label[for="account_last_name"] .required {
    display: none;
}

So far so good.

Make my account Last name field not required

Remove Default Fields

What I am going to show you below doesn’t look like a clean solution, but it is the only one.

Step by step:

  1. Choose what fields you would like to remove and make them not required first (skip this step for the password fields).
  2. Duplicate this file form-edit-account.php from WooCommerce templates/myaccount to your current theme woocommerce/myaccount directory, create it if not exists.
  3. Remove the fields from that file code 😁
  4. Done!
Remove WooCommerce my account default fields
I also changed “form-row-first” class to “form-row-wide” to make the field fullwidth.

Add a Custom Field (a required one)

Good news guys! If you want to add a custom field in WooCommerce my account page, there is no needs to hardcode anything in form-edit-account.php file! There are two magnificent hooks for you:

Let’s try it now! 🔥

You could display the field using the raw HTML here, but I think there is no reason to make everything so complicated while there is woocommerce_form_field() function which allows to make it so much easier!

/**
 * Step 1. Add your field
 */
add_action( 'woocommerce_edit_account_form', 'misha_add_field_edit_account_form' );
// or add_action( 'woocommerce_edit_account_form_start', 'misha_add_field_edit_account_form' );
function misha_add_field_edit_account_form() {
 
	woocommerce_form_field(
		'country_to_visit',
		array(
			'type'        => 'text',
			'required'    => true, // remember, this doesn't make the field required, just adds an "*"
			'label'       => 'Country you want to visit the most',
			'description' => 'Maybe it is Norway or New Zealand or...?',
		),
		get_user_meta( get_current_user_id(), 'country_to_visit', true ) // get the data
	);
 
}
 
/**
 * Step 2. Save field value
 */
add_action( 'woocommerce_save_account_details', 'misha_save_account_details' );
function misha_save_account_details( $user_id ) {
 
	update_user_meta( $user_id, 'country_to_visit', sanitize_text_field( $_POST['country_to_visit'] ) );
 
}
 
/**
 * Step 3. Make it required
 */
add_filter('woocommerce_save_account_details_required_fields', 'misha_make_field_required');
function misha_make_field_required( $required_fields ){
 
	$required_fields['country_to_visit'] = 'Country you want to visit the most';
	return $required_fields;
 
}

Here is my field:

Add a field to WooCommerce edit account page

It is worth mentioning that with the help of woocommerce_form_field() you can add fields of any type, like textarea, selects, radio buttons etc.

More WooCommerce Good Stuff

Misha Rudrastyh

Misha Rudrastyh

I love WordPress, WooCommerce and Gutenberg so much. 10 yrs of experience.

Need some custom developer help? Let me know

Follow Misha

Need some help with WooCommerce?

If you need some professional developer help, I will be happy to assist you.

Contact me Who I am?

Comments — 2

Leave a comment

php js HTML CSS Code