WordPress Custom Login page fix redirect on error

Code Snippets

While working on a client site recently I noticed that when using a custom login form (such as a page with Divi’s Login module), when a user enters incorrect login credentials they’re redirected to the wp-admin login instead of back to the custom form.

This is less than ideal, considering if we’ve created a custom login form we want the user to stay on the form.

custom login form

After some quick Googling, I found many solutions but they only solved half the problem – they only worked if the user entered an incorrect username/password combination and didn’t leave either field blank.

However, if the user left the fields blank and submitted the form, the authentication function never runs so the user is still redirected to the wp-login page.

Since I couldn’t find any usable solutions, I decided to put together a few ideas to make this work properly. Here is the full code to keep failed login attempts on your custom login form. You can add it to your child theme’s functions.php file.

function wpcc_front_end_login_fail( $username ) {
      $referrer = $_SERVER['HTTP_REFERER']; 
      if ( !empty( $referrer ) && !strstr( $referrer,'wp-login' ) && !strstr( $referrer,'wp-admin' ) ) {
        $referrer = esc_url( remove_query_arg( 'login', $referrer ) );
        wp_redirect( $referrer . '?login=failed' );
        exit;
      }
    }
add_action( 'wp_login_failed', 'wpcc_front_end_login_fail' );

function custom_authenticate_wpcc( $user, $username, $password ) {
      if ( is_wp_error( $user ) && isset( $_SERVER[ 'HTTP_REFERER' ] ) && !strpos( $_SERVER[ 'HTTP_REFERER' ], 'wp-admin' ) && !strpos( $_SERVER[ 'HTTP_REFERER' ], 'wp-login.php' ) ) {
        $referrer = $_SERVER[ 'HTTP_REFERER' ];
        foreach ( $user->errors as $key => $error ) {
            if ( in_array( $key, array( 'empty_password', 'empty_username') ) ) {
              unset( $user->errors[ $key ] );
              $user->errors[ 'custom_'.$key ] = $error;
            }
          }
      }
   
    return $user;
}
add_filter( 'authenticate', 'custom_authenticate_wpcc', 31, 3);

The above code will keep failed login attempts on your custom login page and append ?login=failed to the URL, so you can display a custom error message if you’d like.

Have a better way? Drop it in the comments below and let’s talk about it!

As always, happy creating!

Join the Discussion

Have something to add to this or want to comment on something mentioned in the article? Hop on over to our offical Facebook page and join the discussion!

About the Author

Alex Brinkman

Alex Brinkman

In addition to being an entrepreneur, Alex is addicted to lifestyle design, a sucker for motivational quotes and: "... just an all around great guy." - everyone When he's not busy banging on a laptop in a some obscure coffeeshop, he enjoys obstacle course races, giving random strangers compliments and automating as much of his life as possible.