WordPress custom template for user login

If you are looking for a custom template for your theme. Which including the WordPress user login and signup page process.
Generally, WordPress have default layout for user login and signup.

I am sharing a custom code. I hope it will help you.

/* Main redirection of the default login page */
function mytheme_redirect_login_page() {
	$login_page  = home_url('/login/');
	//$page_viewed = explode('?', basename($_SERVER['REQUEST_URI']) );
	
	//if( $page_viewed[0] == "wp-login.php" && $_SERVER['REQUEST_METHOD'] == 'GET' ) {
	$page_viewed = basename($_SERVER['REQUEST_URI']);

	if($page_viewed == "wp-login.php" && $_SERVER['REQUEST_METHOD'] == 'GET') {
		$redirect_to = isset( $_SERVER['QUERY_STRING'] ) ? $login_page.'/?'.$_SERVER['QUERY_STRING'] : $login_page;
		wp_redirect($redirect_to);
		exit;
	}
}
add_action('init','mytheme_redirect_login_page');

You need to add a page in your WordPress website with name login. You can change that If you change the login page slug. Same will update in above function code.

Following function code will redirect the user on the login page if the login failed.

More information about wp_login_failed

/* Where to go if a login failed */
function mytheme_custom_login_failed() {
	$login_page  = home_url('/login/');
	wp_redirect($login_page . '?login=failed');
	exit;
}
add_action('wp_login_failed', 'mytheme_custom_login_failed');

Following function verify the login form submit. Where to go if any of the fields were empty.

/* Where to go if any of the fields were empty */
function mytheme_verify_user_pass($user, $username, $password) {
	$login_page  = home_url('/login/');
	
	
	if($username == "" || $password == "") {
		if(isset($_SERVER['QUERY_STRING'])) {
			wp_redirect($login_page.'?'.$_SERVER['QUERY_STRING']);
		} else {
			wp_redirect($login_page . "?login=empty");
		}
		exit;
	}
}
add_filter('authenticate', 'mytheme_verify_user_pass', 1, 3);

What to do on logout. User will redirect to the login page.

/* What to do on logout */
function mytheme_logout_redirect() {
	$login_page  = home_url('/login/');
	wp_redirect($login_page . "?login=false");
	exit;
}
add_action('wp_logout','mytheme_logout_redirect');

If you want to add sign out link in your theme login. This following will help you. Kindly replace your menu location.

add_filter( 'wp_nav_menu_items', 'mytheme_custom_menu_item', 10, 2 );
function mytheme_custom_menu_item ( $items, $args ) {
    if ($args->theme_location == 'user_menu') {
        $items .= '<li><a class="dropdown-item" href="'. wp_logout_url() .'">Sign Out</a></li>';
    }
    return $items;
}

The following function will redirect the user after login successfully.

function mytheme_login_redirect( $redirect_to, $request, $user  ) {
	if ( ! is_wp_error( $user ) ) {
		// do redirects on successful login
		
		if( $redirect_to != ''){
			return $redirect_to;
		}
		elseif ( $user->has_cap( 'administrator' ) || $user->has_cap( 'shop_manager' ) ) {
			return admin_url();
		} else {
			return home_url();
		} 
	} else {
		// display errors, basically
		return $redirect_to;
	}
	
}

add_filter( 'login_redirect', 'mytheme_login_redirect', 10, 3 );

For view full source code. Kindly visit this GitHub repository