WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

How to create the custom login/Registration form using AJAX.

share|improve this question
I miss your homework. – toscho Jan 4 '13 at 8:01
up vote 3 down vote accepted

Here is a simple shortcode that gets the job done:

function ajaxlogin_shortcode_handler($atts,$content=null){
    if (is_user_logged_in())

    $retval = '<p id="message" style="color:red"></p>'
            .wp_login_form(array('form_id' => 'ajaxloginform','echo' => false)).
            '<div id="login-result" style="position:absolute; top:300px; left: 670px;">
                <img src="path/ajax-loader.gif"/>

    $js = <<<JS
<script type="text/javascript">
        $("#ajaxloginform").click(function() {
            // turn loading screen on
            //get foem data
            var input_data = $('#my-login-form').serialize();
            //make ajax call
                type: "POST",
                url: "<?php echo site_url('wp-login.php','login_post'); ?>",
                data: input_data,
                success: function(msg) {
                    // if login incorrect, wordpress will redirect user to its own login form. We scan for an error term.
                    var reg1 = /login_error/g;
                    if (reg1.test(msg)) {
                        $('#message').html("<?php _e('Your login credentials is not correct. Please try again.'); ?>");
                    }else {
                        // login success. redirect users to some page.
                        //$(location).attr('href', '/my-account/');
                        //or reload the same page
            // turn loading screen off
            // prevent actual submission of form
            return false;
    //enqueue jquery if its not already loaded
    return $retval .$js;



share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.