Sometimes we need to add the extra fields in the WooCommerce registration form to get some more information, which by default you can’t get from the registration page. In this tutorial, I will share how to add custom fields in user registration on the “My Account” page.
There are two ways to add the custom fields in the registration form, first is by creating a custom WordPress plugin by using the below code snippets or secondly you can add below code directly in your functions.php file. By default my account page has only two fields email address & password, see the below screenshot.
Let’s follow the below steps, In this tutorial, I am going to add First name & Last name on the registration form. Add Below code to your functions.php file.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
function wooc_extra_register_fields() {?> <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'] ); ?>" required /> </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'] ); ?>" required /> </p> <div class="clear"></div> <?php } add_action( 'woocommerce_register_form_start', 'wooc_extra_register_fields' ); |
Now add the below code to validate the First name & last name. Copy paste the below code after the above code inside the functions.php file.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
/** * Validate the extra register fields. * * @param string $username Current username. * @param string $email Current email. * @param object $validation_errors WP_Error object. * * @return void */ function wooc_validate_extra_register_fields( $username, $email, $validation_errors ) { if ( isset( $_POST['billing_first_name'] ) && empty( $_POST['billing_first_name'] ) ) { $validation_errors->add( 'billing_first_name_error', __( 'Nombre es un campo requerido.', 'woocommerce' ) ); } if ( isset( $_POST['billing_last_name'] ) && empty( $_POST['billing_last_name'] ) ) { $validation_errors->add( 'billing_last_name_error', __( 'Apellidos es un campo requerido.', 'woocommerce' ) ); } } add_action( 'woocommerce_register_post', 'wooc_validate_extra_register_fields', 10, 3 ); |
Now add the below code inside the functions.php filSave the extra register fields
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
/** * Save the extra register fields. * * @param int $customer_id Current customer ID. * * @return void */ function wooc_save_extra_register_fields( $customer_id ) { if ( isset( $_POST['billing_first_name'] ) ) { // WordPress default first name field. update_user_meta( $customer_id, 'first_name', sanitize_text_field( $_POST['billing_first_name'] ) ); // WooCommerce billing first name. update_user_meta( $customer_id, 'billing_first_name', sanitize_text_field( $_POST['billing_first_name'] ) ); } if ( isset( $_POST['billing_last_name'] ) ) { // WordPress default last name field. update_user_meta( $customer_id, 'last_name', sanitize_text_field( $_POST['billing_last_name'] ) ); // WooCommerce billing last name. update_user_meta( $customer_id, 'billing_last_name', sanitize_text_field( $_POST['billing_last_name'] ) ); } } add_action( 'woocommerce_created_customer', 'wooc_save_extra_register_fields' ); |
After adding the above code in your functions.php file, your my account page will look like the below screenshot.
Do you like & share this article with your friends, and don’t forget to follow us on Facebook and Twitter to learn cool WordPress tutorials.
If you like FreeWebMentor and you would like to contribute, you can write an article and mail your article to [email protected] Your article will appear on the FreeWebMentor main page and help other developers.
Article Tags: my account registration page, woocommerce my account, woocommerce tutorial, woocommerce tutorials, wordpress woocommerce tutorial
