How to add fields in custom registration form, validate it and aave to db? [closed]

by

To modify the theme’s registration would be possible, but definitely not recommended. It is likely that you would only be able to add your additional fields by directly modifying the theme files, especially with something like user registration. It would be a pain to maintain if you intend to keep your theme up to date.

What I recommend doing instead is:
Add your own page where the user will add their additional information that you need to capture, capturing it AFTER their registration.

  1. Let the user proceed to use the normal unmodified registration form.
  2. User logs in
  3. Check if additional information has been captured via user_meta
  4. If not, redirect to page to capture this data.

Here is an example of what the code might look like:

Use action hooks to do the check if the user has filled out their additional information. I recommend using a childtheme or making your own plugin for the following:

//'template_redirect' hook works well for what we need to do. 
add_action( 'template_redirect', 'vlad_additional_info_check' );

/**
 * Check if a user has filled out additional required information to complete registration, if not redirect them to page to complete registration.
 */
function vlad_additional_info_check() {
    //If the user is not logged in, or an administrator, we can just return out of the  function and do nothing further.
    if ( ! is_user_logged_in() || current_user_can( 'administrator' ) ) {
        return;
    }

    //Check if user has filled out their additional information or not. I am using vlad_additional_info as the meta key, you can use anything.
    if ( ! get_user_meta( get_current_user_id(), 'vlad_additional_info', true ) === "" ) {
        //Here the user has not filled out the fields
        global $post;
        $page_slug = $post->post_name;
        //You want to redirect the user to a page, for example 'complete-registration', with the for to capture the additional data. First check that they are not already on the page.
        if ( $page_slug !== 'complete-registration' ) {
            wp_redirect( network_site_url( '/complete-registration/' ) );
            exit();
        }
    }
}

For your form and capturing the data, you will have something along the lines of:

//complete-registration.php
//Check if the form data has been submitted
if ( !isset( $_POST['submit_complete_registration'] ) ) {
    //Here is where the form goes
    ?>
    <form action="?" method="post">
        <label>Phone Number *
            <input type="text" value="" name="vlad_phone_number">
        </label>
    </form>
    <?php
} else {
    //Form data has been submitted
    //Here you can validate the forms posted fields. Make sure you collectively validate that all fields are valid, before updating any user meta.
    if ( isset( $_POST['vlad_phone_number'] ) ) {
        //Do validations...
        $valid_number = $_POST['vlad_phone_number'];
    }

    if ( $everything_is_valid ) {
        $user_id = get_current_user_id();
        update_user_meta( $user_id, 'vlad_phone_number', $valid_number ); //can use any name for your meta
        //...
        //...
        //Now finally update the user meta that we use to check if a user has submitted this info:
        update_user_meta( $user_id, 'vlad_additional_info', true ); //can use any name for your meta

    } else {
        ?><h2>Please enter a valid...</h2><?php
    }
}

And then to render your form on a page, you can use a shortcode to just load your complete-registration.php file:

add_shortcode( 'vlad-additional-form','vlad_additional_info_form_render' );

function vlad_additional_info_form_render() {
    ob_start();
    require 'PLUGIN_OR_CHILDTHEME_DIRECTORY/complete-registration.php'; //Replace with your own file directory
    return ob_get_clean();
}

Some links and info on some of the WordPress functions that we are using:

https://developer.wordpress.org/reference/functions/get_user_meta/
https://developer.wordpress.org/reference/functions/update_user_meta/
https://developer.wordpress.org/reference/functions/add_shortcode/
https://developer.wordpress.org/reference/functions/add_action/
https://developer.wordpress.org/reference/functions/wp_redirect/