2011-11-05 13 views
8

Tengo el formulario de inicio de sesión de WordPress trabajando en el front-end de mi sitio web, para permitir a mis usuarios iniciar sesión sin tener que visitar el wp-login.php o dejar el "tema" o el sitio web.WordPress Iniciar sesión en jQuery Popup: cómo validar el inicio de sesión con jQuery Ajax?

Si va a http://westendmediacentre.com/dev y hace clic en iniciar sesión, puede ver que tengo el formulario que aparece dentro de una ventana emergente de jQuery. Mi código para esto es la siguiente:

código del formulario:

<div class="login-form"> 
     <form action="<?php echo get_option('home'); ?>/wp-login.php" method="post"> 
     <input type="text" name="log" id="log" value="Username<?php echo wp_specialchars(stripslashes($user_login), 1) ?>" size="20" class="login-fields" onclick="this.value='';" onblur="this.value=!this.value?'Username':this.value;"/> 
     <input type="password" name="pwd" id="pwd" value="Password" size="20" class="login-fields" onclick="this.value='';" onblur="this.value=!this.value?'Password':this.value;"/> 
     <input type="submit" name="submit" value="Login" class="login-button" /> 
     <input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" /> 
     </form> 
</div> 

jQuery:

$('.button-login').click(function() { 
    $('.login-box').fadeIn('slow', function() { 
    // Animation complete 
    }); 
    $(".login-box").css({'z-index' : '10000'}); 
    $("#the-lights").css({'display' : 'block'}); 
    $("#the-lights").css({'z-index' : '1'}); 
    $("#the-lights").fadeTo("slow",0.7); 
}); 
$('.login-box-close').click(function() { 
    $('.login-box').fadeOut('fast', function() { 
    // Animation complete 
    }); 
    $("#the-lights").fadeTo("slow",0); 
    $("#the-lights").css({'display' : 'none'}); 
}); 

Esto funciona perfectamente, sin embargo, si intenta iniciar la sesión con algunas malas credenciales, se obtiene re -dirigido a una página de WordPress que le da el error.

Lo que me gustaría hacer es tener estos errores en mi jQuery popup, de modo que cuando intente iniciar sesión con malas credenciales, aparezca un mensaje de error arriba o debajo del formulario, en lugar de redirigir a otro página con el error que se muestra allí.

He intentado seguir este tutorial, sin embargo, no funciona bien con mi código existente: http://www.tutorialstag.com/custom-wordpress-login-without-using-a-plugin.html

agradecería si alguien podría publicar una solución de trabajo

+0

No estás registrando tu nombre de usuario a través de Ajax. Acaba de publicar en login.php. El tutorial al que se hace referencia es la forma correcta de publicar el inicio de sesión utilizando ajax. –

+0

Cuando intento utilizar el tutorial, en una página en blanco, puedo obtenerlo correctamente. Pero cuando trato de integrarlo con mi código existente, tengo problemas. Al iniciar sesión, vuelve a cargar toda la página dentro de mi jQuery popup en el div "results", en lugar de solo el resultado. Todo lo que necesito es cuando hay un error, lo dice en los resultados div, y cuando es exitoso, para redirigir a una página. ¿Cómo puedo hacer eso? –

+0

esta pregunta debe ir a http://wordpress.stackexchange.com/ –

Respuesta

1

Esta estructura tiene que ver con wordperess', en primer todo lo que debe saber es que incluso si proporciona credenciales de inicio de sesión correctas o incorrectas, su estructura redirecciona al usuario a wp-login.php (debido a)
< ?php echo get_option('home'); ?>/wp-login.php línea (es decir, solo está publicando su nombre de usuario y contraseña en wp-login.php)
Y luego, si la información suministrada es correcta, Wordpress vuelve a redirigir para usar r a la página de inicio de inmediato, de lo contrario muestra un error (con efecto de sacudida), puede encontrar todas estas acciones en el archivo wp-login.php.
Hay dos opciones diferentes que puede usar.

  • Puede cortar archivo wp-login.php como
    si un usuario aún no ha alimentación correcta nombre de usuario/contraseña entonces que se redirigir de nuevo a http://www.westendmediacentre.com/dev/
  • Puede construir su propio mecanismo de inicio de sesión con el Ajax validar (me refiero a preparar un archivo PHP para la conexión de base de datos y el nombre de usuario recuperar y contraseña de la base de datos y enviar los resultados a su sistema de la conexión)

Si selecciona segunda manera, se puede controlar this publicación. Eso es muy útil

0

NO edite ningún archivo de núcleo si es posible. Lo lamentarás más tarde.

Si tuviera que escribir un plugin y el plugin estaba manejando su emergente jQuery - entonces usted puede hacer esto:

Para hacer un formulario de acceso, se puede ver en este plugin: http://wordpress.org/extend/plugins/sidebar-login/

Entonces simplemente tendría la mayor parte de esa lógica en un archivo PHP en el que su script AJAX publicaría. Si el inicio de sesión falla, los datos devueltos del archivo PHP se enviarán a su script AJAX y usted estaría bien.

0

Te estas perdiendo esta parte del tutorial

$("#submitbtn").click(function() { 

    $('#result').html('<img src="<?php bloginfo(' 
    template_url '); ?>/images/loader.gif" class="loader" />').fadeIn(); 
    var input_data = $('#wp_login_form').serialize(); 
    $.ajax({ 
     type: "POST", 
     url: "<?php echo " 
     http: //" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?>", 
     data: input_data, 
     success: function(msg) { 
      $('.loader').remove(); 
      $(' 
<div>').html(msg).appendTo('div#result').hide().fadeIn('slow'); 
     } 
    }); 
    return false; 

}); 
Cuestiones relacionadas