WooCommerce: Add Date of Birth Field to Account Details Page

In this tutorial, we’ll guide you through the process of adding a Date of Birth field to the account details page in WooCommerce. It allows users to input their DOB and store it in their user meta. The data is then saved and retrieved appropriately whenever users update their account details. It can be helpful for various purposes, such as age verification or personalized marketing.

• Default
• After Changes

/**
* Snippet Name:  Add Date of Birth field to account details page
* Snippet Author: wpsnippets.dev
*/

// Add Date of Birth field to account details page
function wps_add_dob_field_to_account_details() {
    $user_id = get_current_user_id();
    $dob = get_user_meta( $user_id, 'account_dob', true );
    ?>
    <p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
        <label for="account_dob"><?php _e( 'Date of Birth', 'textdomain' ); ?></label>
        <input type="date" class="woocommerce-Input woocommerce-Input--date input-text" name="account_dob" id="account_dob" value="<?php echo esc_attr( $dob ); ?>">
    </p>
    <?php
}
add_action( 'woocommerce_edit_account_form', 'wps_add_dob_field_to_account_details' );


// Save Date of Birth field data from account details page
function wps_save_dob_field_from_account_details( $user_id ) {
    if ( isset( $_POST['account_dob'] ) && ! empty( $_POST['account_dob'] ) ) {
        $dob = sanitize_text_field( $_POST['account_dob'] );
        update_user_meta( $user_id, 'account_dob', $dob );
    }
}
add_action( 'woocommerce_save_account_details', 'wps_save_dob_field_from_account_details', 10, 1 );

Code Explanation

This Code snippet mainly uses 2 functions:

1. Adding Date of Birth Field to WooCommerce Account Details Page
   • The function wps_add_dob_field_to_account_details() adds a Date of Birth (DOB) field to the WooCommerce account details page. It retrieves the current user’s ID using get_current_user_id() and then fetches the DOB value stored in the user meta.
   • The function is hooked to the woocommerce_edit_account_form ensuring that the DOB field is displayed on the account details page.
2. Saving Date of Birth Field Data from WooCommerce Account Details Page
   • The function wps_save_dob_field_from_account_details($user_id) saves the entered Date of Birth as user metadata using update_user_meta(). It ensures that the Date of Birth is cleaned and formatted before saving it in the database.
   • The function is hooked to woocommerce_save_account_details. This ensures that when a user saves their account details, the DOB field data is processed and stored accordingly.

Click here to explore the code snippet for adding the Date of Birth field to the WooCommerce registration form.