Comment puis-je rediriger l'utilisateur après avoir entré un mauvais mot de passe?

J'utilise wp_login_form()pour afficher le formulaire de connexion dans une fenêtre de dialogue jQuery.

Si l'utilisateur entre un mauvais mot de passe, l'utilisateur est redirigé vers le backend. Je n'en veux pas. Existe-t-il un moyen d'informer l'utilisateur qu'il a entré un mauvais mot de passe et qu'il reste toujours sur la même page?

Avant d' wp_login_form()arriver, j'utilisais un plugin. J'espère que je pourrai éviter d'utiliser un plugin pour cela.

Mon code:

wp_login_form( array(
  'label_remember' => __( 'Remember me' ),
  'label_log_in' => __( 'Login' )
) );

wp_login_form()crée un formulaire avec un attribut d'action de site_url/wp-login.php, ce qui signifie que lorsque vous cliquez sur le bouton soumettre, le formulaire est publié, site_url/wp-login.phpqui ignore redirect_to sur les erreurs (comme un mauvais mot de passe), donc dans votre cas, revenez à l'utilisation d'un plugin ou recréez l'ensemble du processus de connexion et de cette façon, vous aurez le contrôle sur les erreurs, jetez un œil à Vérifier le nom d'utilisateur correct sur le formulaire de connexion personnalisé, qui est une question très similaire.

Je suis venu ici de Google. Mais la réponse ne m'a pas satisfait. Je cherchais depuis un moment et j'ai trouvé une meilleure solution.

Ajoutez ceci à votre functions.php :

add_action( 'wp_login_failed', 'my_front_end_login_fail' );  // hook failed login

function my_front_end_login_fail( $username ) {
   $referrer = $_SERVER['HTTP_REFERER'];  // where did the post submission come from?
   // if there's a valid referrer, and it's not the default log-in screen
   if ( !empty($referrer) && !strstr($referrer,'wp-login') && !strstr($referrer,'wp-admin') ) {
      wp_redirect( $referrer . '?login=failed' );  // let's append some information (login=failed) to the URL for the theme to use
      exit;
   }
}

La méthode actuelle que j'utilise pour traiter tous les problèmes décrits ici fonctionne très bien même avec un nom d'utilisateur / mot de passe vide et ne s'appuie pas sur javascript (bien que le js puisse être bon avec cela).

add_action( 'wp_login_failed', 'custom_login_failed' );
function custom_login_failed( $username )
{
    $referrer = wp_get_referer();

    if ( $referrer && ! strstr($referrer, 'wp-login') && ! strstr($referrer,'wp-admin') )
    {
        wp_redirect( add_query_arg('login', 'failed', $referrer) );
        exit;
    }
}

La clé est ce filtre pour changer la façon dont un nom d'utilisateur / mot de passe vide est traité:

add_filter( 'authenticate', 'custom_authenticate_username_password', 30, 3);
function custom_authenticate_username_password( $user, $username, $password )
{
    if ( is_a($user, 'WP_User') ) { return $user; }

    if ( empty($username) || empty($password) )
    {
        $error = new WP_Error();
        $user  = new WP_Error('authentication_failed', __('<strong>ERROR</strong>: Invalid username or incorrect password.'));

        return $error;
    }
}

Vous pouvez aller plus loin et remplacer complètement wp-login.php en redirigeant les utilisateurs vers votre page de connexion personnalisée et en utilisant également cette page pour la redirection login_failed. Code complet:

/**
 * Custom Login Page Actions
 */
// Change the login url sitewide to the custom login page
add_filter( 'login_url', 'custom_login_url', 10, 2 );
// Redirects wp-login to custom login with some custom error query vars when needed
add_action( 'login_head', 'custom_redirect_login', 10, 2 );
// Updates login failed to send user back to the custom form with a query var
add_action( 'wp_login_failed', 'custom_login_failed', 10, 2 );
// Updates authentication to return an error when one field or both are blank
add_filter( 'authenticate', 'custom_authenticate_username_password', 30, 3);
// Automatically adds the login form to "login" page
add_filter( 'the_content', 'custom_login_form_to_login_page' );

/**
 * Custom Login Page Functions
 */
function custom_login_url( $login_url='', $redirect='' )
{
    $page = get_page_by_path('login');
    if ( $page )
    {
        $login_url = get_permalink($page->ID);

        if (! empty($redirect) )
            $login_url = add_query_arg('redirect_to', urlencode($redirect), $login_url);
    }
    return $login_url;
}
function custom_redirect_login( $redirect_to='', $request='' )
{
    if ( 'wp-login.php' == $GLOBALS['pagenow'] )
    {
        $redirect_url = custom_login_url();

        if (! empty($_GET['action']) )
        {
            if ( 'lostpassword' == $_GET['action'] )
            {
                return;
            }
            elseif ( 'register' == $_GET['action'] )
            {
                $register_page = get_page_by_path('register');
                $redirect_url = get_permalink($register_page->ID);
            }
        }
        elseif (! empty($_GET['loggedout'])  )
        {
            $redirect_url = add_query_arg('action', 'loggedout', custom_login_url());
        }

        wp_redirect( $redirect_url );
        exit;
    }
}
function custom_login_failed( $username )
{
    $referrer = wp_get_referer();

    if ( $referrer && ! strstr($referrer, 'wp-login') && ! strstr($referrer, 'wp-admin') )
    {
        if ( empty($_GET['loggedout']) )
        wp_redirect( add_query_arg('action', 'failed', custom_login_url()) );
        else
        wp_redirect( add_query_arg('action', 'loggedout', custom_login_url()) );
        exit;
    }
}
function custom_authenticate_username_password( $user, $username, $password )
{
    if ( is_a($user, 'WP_User') ) { return $user; }

    if ( empty($username) || empty($password) )
    {
        $error = new WP_Error();
        $user  = new WP_Error('authentication_failed', __('<strong>ERROR</strong>: Invalid username or incorrect password.'));

        return $error;
    }
}
function custom_login_form_to_login_page( $content )
{
    if ( is_page('login') && in_the_loop() )
    {
        $output = $message = "";
        if (! empty($_GET['action']) )
        {
            if ( 'failed' == $_GET['action'] )
                $message = "There was a problem with your username or password.";
            elseif ( 'loggedout' == $_GET['action'] )
                $message = "You are now logged out.";
            elseif ( 'recovered' == $_GET['action'] )
                $message = "Check your e-mail for the confirmation link.";
        }

        if ( $message ) $output .= '<div class="message"><p>'. $message .'</p></div>';
        $output .= wp_login_form('echo=0&redirect='. site_url());
        $output .= '<a href="'. wp_lostpassword_url( add_query_arg('action', 'recovered', get_permalink()) ) .'" title="Recover Lost Password">Lost Password?</a>';

        $content .= $output;
    }
    return $content;
}

Personnalisez et ajoutez-les pour ajouter votre logo à la page wp-login pour la récupération du mot de passe:

// calling it only on the login page
add_action( 'login_enqueue_scripts', 'custom_login_css', 10 );
function custom_login_css() { wp_enqueue_style( 'custom_login_css', get_template_directory_uri() .'/library/css/login.css', false ); }
// changing the logo link from wordpress.org to your site
add_filter( 'login_headerurl', 'custom_login_logo_url' );
function custom_login_logo_url() { return home_url(); }
// changing the alt text on the logo to show your site name
add_filter( 'login_headertitle', 'custom_login_title' );
function custom_login_title() { return get_option('blogname'); }

Logo de connexion css:

.login h1 a {
    background: url(../images/login-logo.png) no-repeat top center;
    width: 274px;
    height: 63px;
    text-indent: -9999px;
    overflow: hidden;
    padding-bottom: 15px;
    display: block;
}

EDIT: Je viens de l'implémenter sur une autre page de formulaire, et j'ai trouvé que "l'étape plus loin" ci-dessus était plus complète, et corrigé de petites erreurs de syntaxe dans "add_actions". Ajout de quelques commentaires et d'une méthode pour ajouter automatiquement le formulaire de connexion à la page de connexion sans fichier de modèle distinct. La méthode du formulaire de connexion devrait fonctionner dans la plupart des cas, car elle est attachée à "the_content", elle pourrait provoquer et émettre si vous avez plus d'une boucle sur la page de connexion, utilisez simplement un modèle page-login.php dans ce cas.

Une solution pour le point de Szczepan Hołyszewski sur les champs vides dans la solution acceptée, le jQuery suivant empêchera d'accéder à la page de connexion wp standard: (ajouter au modèle de page de connexion ou footer.php)

jQuery("#loginform-custom").submit(function(){
     var isFormValid = true;
       jQuery("input").each(function()
       {
       if (jQuery.trim($(this).val()).length == 0){
       jQuery(this).addClass("submit_error");
       isFormValid = false;
       }     
     else {
     jQuery(this).removeClass("submit_error");
     }
     });
     return isFormValid;
});

Un ajout à la réponse d'Alexey. Vous pouvez ajouter une fonction jquery pour vérifier que l'un des champs n'est pas vide. De cette façon, le formulaire ne sera pas soumis à moins qu'il y ait quelque chose à vérifier, empêchant WordPress de rediriger vers /wp-login.php.

  <script>
        $("#wp-submit").click(function() {
          var user = $("input#user_login").val();
            if (user == "") {
            $("input#user_login").focus();
            return false;
          }
         });
  </script>   

Vous ne savez toujours pas comment corriger l'aspect du mot de passe oublié

jQuery("#loginform-custom").submit(function(){
     var isFormValid = true;
       jQuery("input").each(function()
       {
       if (jQuery.trim($(this).val()).length == 0){
       jQuery(this).addClass("submit_error");
       isFormValid = false;
       }     
     else {
     jQuery(this).removeClass("submit_error");
     }
     });
     return isFormValid;
});