title: How To Get Login Errors on Custom Login Form
body: <p>I have created a custom login form through Elementor but can't output the error properly, breaks my site.</p>
  
  <p>I have made a bit of PHP code and amended it to try to collect the WP Errors from the WP Login form but it's not working correctly.</p>
  
  <pre><code>//add hook to redirect the user back to the elementor login page if the login failed
  add_action( 'wp_login_failed', 'elementor_form_login_fail' );
  function elementor_form_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) &amp;&amp; !strstr($referrer,'wp-login') &amp;&amp; !strstr($referrer,'wp-admin') ) {
          if (is_wp_error($username)) {
          //Login failed, find out why...
          $error_types = array_keys($username-&gt;errors);
          //Error type seems to be empty if none of the fields are filled out
          $error_type = 'both_empty';
          //Otherwise just get the first error (as far as I know there
          //will only ever be one)
          if (is_array($error_types) &amp;&amp; !empty($error_types)) {
              $error_type = $error_types[0];
          }
          wp_redirect(preg_replace('/\?.*/', '', $referrer) . '?login=error&amp;reason=' . $error_type );
          exit;
      }
  }
  </code></pre>
  
  <p>I can successfully test the user has logged in and return an error code using a Bootstrap Alert, but i want to do it so i can collect the exact error.</p>
  
  <p>I know the WP login form does this but i want this exact error to display at the top of my custom login, but whenever i add my code in i get an error saying this saite is experiencing technical difficulties.</p>
  
  <p>My Custom Login form is locate at <a href="https://www.qbeam.co.uk/login" rel="nofollow noreferrer">https://www.qbeam.co.uk/login</a>.</p>