title: Wordpress Login without a page refresh
body: <p>I am working with a custom Wordpress theme where I created a slideDown effect with jQuery which when clicked reveals a login and registration form. I am trying to create an experience where the user does not leave this page when they login or register, instead the div that initially slides down, slides up and the button text changes to the logged in user's name.</p>
  
  <p>At the moment when I click LOGIN, the div slides up, but it doesn't seem that the system is recognizing the logged in user.</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
      $(document).ready(function(){
  
      $(".btn-slide").click(function(){
      $("#slide-panel").slideToggle("slow");
  
     });
  
   });
   &lt;/script&gt;
   &lt;script type="text/javascript"&gt;    
      $('.error').hide();  
          $(".button").click(function() {
        // validate and process form here
          var name = $("input#log").val();  
              if (name == "") {  
                $("label#error").show();  
                $("input#log").focus();  
                return false;  
              }
  
          var dataString = $("#wp_login_form").serialize();
          //alert (dataString);return false;  
  
          $.ajax({
              type: "POST",
              url: "&lt;?php echo "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?&gt;",  
              data: dataString,
              success: function() {
                  $("#slide-panel").slideToggle("slow");
                  $(".slide").html("Hello");
              }
          });
          return false;
      });
   &lt;/script&gt;
  
   &lt;?php wp_head(); ?&gt;
  
   &lt;/head&gt;
  
   &lt;body &lt;?php body_class(); ?&gt;&gt;
  
   &lt;div id="slide-panel"&gt;&lt;!--SLIDE PANEL STARTS--&gt;
      &lt;div class="loginform"&gt;
          &lt;div class="loginformdetails equalheight"&gt;&lt;h2&gt;Member Login&lt;/h2&gt;
              &lt;div class="formrow"&gt;
                  &lt;label class="error" id="error"&gt;Please complete the entire form.&lt;/label&gt;
              &lt;/div&gt;
              &lt;?php 
              global $user_ID;
  
              if($_POST){
              //We shall SQL escape all inputs
              $username = $wpdb-&gt;escape($_REQUEST['log']);
              $password = $wpdb-&gt;escape($_REQUEST['pwd']);
              $remember = $wpdb-&gt;escape($_REQUEST['rememberme']);
  
              if($remember) $remember = "true";
              else $remember = "false";
              $login_data = array();
              $login_data['user_login'] = $username;
              $login_data['user_password'] = $password;
              $login_data['remember'] = $remember;
              $user_verify = wp_signon( $login_data, false ); 
  
              if ( is_wp_error($user_verify) ) {
                  echo $user_verify-&gt;get_error_message();  
                  exit();
                  } else {    
                              echo "&lt;script type='text/javascript'&gt;window.location='". get_bloginfo('url') ."'&lt;/script&gt;";
                              $user_info = get_userdata($user_ID);
                              ?&gt;
                              &lt;div class="loginform"&gt;
                                  &lt;h2&gt;Control Panel&lt;/h2&gt;&lt;ul&gt;
                                  &lt;li&gt;&lt;a href="&lt;?php echo get_option('home'); ?&gt;/wp-admin/"&gt;Dashboard&lt;/a&gt;&lt;/li&gt; |
                                  &lt;li&gt;&lt;a href="&lt;?php echo wp_logout_url( get_bloginfo('url') ); ?&gt;" title="Logout"&gt;Logout&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;
                              &lt;/div&gt;&lt;!--loginform ends--&gt;
                              &lt;?php exit();
                          }
                  } else {
                  ?&gt; 
                      &lt;form id="wp_login_form" action="" method="post"&gt;
                      &lt;div class="formrow"&gt;
                          &lt;div class="formLabel"&gt;&lt;label for="log"&gt;Email  &lt;/label&gt;&lt;/div&gt;
                          &lt;div class="forminput"&gt;&lt;input type="text" name="log" id="log" value="&lt;?php echo wp_specialchars(stripslashes($user_login), 1) ?&gt;" size="25" /&gt;&lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="formrow"&gt;
                          &lt;div class="formLabel"&gt;&lt;label for="pwd"&gt;Password  &lt;/label&gt;&lt;/div&gt;
                          &lt;div class="forminput"&gt;&lt;input type="password" name="pwd" id="pwd" size="25" /&gt;&lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="formrow lowercase"&gt;
                          &lt;label for="rememberme"&gt;
                          &lt;input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /&gt; Remember me&lt;/label&gt;
                      &lt;/div&gt;
                      &lt;div class="formrow"&gt;
                          &lt;div class="formLabel"&gt;&lt;input type="submit" name="submit" value="Login" class="button" /&gt;&lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="formrow"&gt;
                          &lt;div class="forminput lowercase"&gt;&lt;a href="&lt;?php echo get_option('home'); ?&gt;/wp-login.php?action=lostpassword"&gt;Forgot password?&lt;/a&gt;&lt;/div&gt;
                      &lt;/div&gt;    
                      &lt;/form&gt;
                      &lt;?php } ?&gt;
          &lt;/div&gt;
      &lt;/div&gt;&lt;!--loginform ends--&gt;
  </code></pre>