How to create your own custom WordPress login page

Some times you might like to roll your own login page just for that little added bespoke or custom website touch, this is probably easier than you realise! All you need to do is create a custom template and use one of the built in WordPress functions wp_login_form simples! Here’s how to create your own custom WordPress login page.

First of all you need to create a simple custom page template in your theme folder eg: custom-login.php with the following code at the top of your custom page template:

/*
Template Name: Custom Login
*/

Now when you create a new page in the backend you will get the option to use this template as the framework for the page you are creating. So, in this template you will also need the following snippet:

if ( ! is_user_logged_in() ) { // Display WordPress login form for non logged in users:
    $args = array(
        'redirect' => admin_url(),
        'form_id' => 'loginform-custom', // give the login form an id for styling the css
        'label_username' => __( 'Your Username' ),
        'label_password' => __( 'Your Password' ),
        'label_remember' => __( 'Remember me on this device' ),
        'label_log_in' => __( 'Log In' ),
        'remember' => true
    );
    wp_login_form( $args );
} else { // Otherwise if the users is logged in:
    wp_loginout( home_url() ); // Display "Log Out" link.
    echo " | ";
    wp_register('', ''); // Display "Site Admin" link.
}

Now all you need to do is login to the backend, create a page, select ‘Custom Login’ from the Template dialogue options, preview it and bingo! You’ve just created your own custom and bespoke WordPress login page. You might need to tweak the css styling a little but it will function just like the standard WordPress login page.

Resource: Codex