Submit credentials from a HTML form to WordPress Login process

10 Views

This project uses WordPress, and since WordPress Login/Register Forms are only partially customizable, I need to build my own HTML Form and submit the UserName + Password to WordPress.

I have a problem as I don’t know how to get the Data from the Form Fields and submit them to (via) PHP processor for the WordPress Login.

Read More

Let’s assume I have this relatively simple Form as a ShortCode: 

function project_login_form() {

if(!is_user_logged_in()) {

    $output = project_login_form_fields();
} 
return $output;
}
add_shortcode('login_form', 'project_login_form');

The Fields are then defined in this function: 

function project_login_form_fields() {

ob_start();
    // show any error messages after form submission
    project_show_error_messages(); ?>
    <form id="project_login_form"  class="col-md-8" action="" method="post">
        <div class="row">
            <div class="input-field col-md-3">
                <label for="project_user_login">Username</label>
                <input name="project_user_login" id="project_user_login" class="required" type="text"/>

            </div>
            <div class="input-field col-md-3">
                <label for="project_user_pass">Password</label>
                <input name="project_user_pass" id="project_user_pass" class="required" type="password"/>
            </div>
                <input type="hidden" name="project_login_nonce" value="<?php echo wp_create_nonce('project-login-nonce'); ?>"/>
                <input id="project_login_submit" type="submit" value="Login"/>

        <div>
    </form>
<?php
return ob_get_clean();
}

What would be the correct way to “Connect” this so to get the value from
project_user_login and project_user_pass, to pass it to the WordPress Login Process?

This below is what I have so far, but when I hit the Login Button, I get
Invalid username and Incorrect password
(Yes, they are correct, I am sure 🙂 ) 

function project_login_member() {

if(isset($_POST['project_user_login']) && wp_verify_nonce($_POST['project_login_nonce'], 'project-login-nonce')) {

    // this returns the user ID and other info from the user name
    $user = get_user_by('login','some-name' );

    if(!$user) {
        // if the user name doesn't exist
        project_errors()->add('empty_username', __('Invalid username'));
    }

    if(!isset($_POST['project_user_pass']) || $_POST['project_user_pass'] == '') {
        // if no password was entered
        project_errors()->add('empty_password', __('Please enter a password'));
    }

    // check the user's login with their password
    if(!wp_check_password($_POST['project_user_pass'], $user->user_pass, $user->ID)) {
        // if the password is incorrect for the specified user
        project_errors()->add('empty_password', __('Incorrect password'));
    }

    // retrieve all error messages
    $errors = project_errors()->get_error_messages();

    // only log the user in if there are no errors
    if(empty($errors)) {

        wp_set_auth_cookie($_POST['project_user_login'], $_POST['project_user_pass'], true);
        wp_set_current_user($user->ID, $_POST['project_user_login']);   
        do_action('wp_login', $_POST['project_user_login']);

        wp_redirect(home_url()); exit;
    }
}
}
add_action('init', 'project_login_member');
Post Views: 10

Related posts

2 comments

  1. The project_login_member() is going to be your callback function that is listening for a specific request of POST. You want to hook that into add_action( 'wp', 'project_login_member' );

    Next, you can add a wp_nonce_field in your form like this;

    $registration_token = strtolower( wp_generate_password( 10, false, false ) ) ?>

<input type="hidden" name="registration_token" value="<?php echo     esc_attr( $registration_token ) ?>">

<?php wp_nonce_field( 'user_registration-' . $registration_token, 'registration_nonce' ) ?>

<p>
 <button type="submit" id="submit-registration">Submit</button>
</p>

    Last, set the callback to listen for the right thing, verify your nonce field and then add the rest of the checks for your callback. 

    function project_member_login() {
    //Check to see if 'POST' exists
    if ( 
        'POST' !== $_SERVER['REQUEST_METHOD']
        ||
        ! isset( $_POST['registration_token'] )
        ||
        ! isset( $_POST['registration_nonce'] )
        ||
        false === wp_verify_nonce( $_POST['registration_nonce'], 'user_registration-' . $_POST['registration_token'] )

        ) {
            return;
        }
        //sign user into WP
        //save your $_POST vars into vars and use wp_signon() to log them in.
        $creds = array(
            'user_login'    => $user_login,
            'user_password' => $user_pass,
            'remember'      => true,
        );

        $user = wp_signon( $creds, false );

        wp_redirect( home_url() );
        exit;
}

  2. You can get user object by email or by username when submitted by custom form

    $user = get_user_by( 'email', 'user@example.com' );
$user = get_user_by( 'login', 'user@example.com' );

    then pass the user ID and user login to this function below as follows : 

    if( $user ) {
    wp_set_current_user( $user->ID, $user->user_login );
    wp_set_auth_cookie( $user->ID );
    do_action( 'wp_login', $user->user_login );
}

    This will make your user login having posted username and password

    Take care of WP_error though for successful login

Comments are closed.