WordPress Login Form Short Code

A lot of people want the ability to display the WordPress login form within the content of one of the site’s pages. By default, WordPress does not provide any way to do this, so we are going to write a really quick, simple short code to display the login form.

The plugin only requires one simple function that will return the contents (the login form) of the wp_login_form() function.

function pippin_login_form_shortcode( $atts, $content = null ) {
 
	extract( shortcode_atts( array(
      'redirect' => ''
      ), $atts ) );
 
	if (!is_user_logged_in()) {
		if($redirect) {
			$redirect_url = $redirect;
		} else {
			$redirect_url = get_permalink();
		}
		$form = wp_login_form(array('echo' => false, 'redirect' => $redirect_url ));
	} 
	return $form;
}
add_shortcode('loginform', 'pippin_login_form_shortcode');

Inside of the function we’ve added a call to the extract function in order to retrieve the attributes passed to the shrotcode, which allows us to specific the redirect url, or the location the user should be sent upon successful login.

After we get the shortcode attributes, we do a quick check to see if the current user is logged in, as there is no reason to display the form if they are already logged in. If the user is not logged in, then we return the wp_login_form() function, which will display the actual login form.

Finally, after the closing } we use the add_shortcode() function to make the shortcode available for use in the content editor.

Now we can display our form on any page or post like this:

[loginform redirect="http://my-redirect-url.com"]

Download the working plugin.
Download

Justin
June 12, 2011

Hi, Really loving this, i’ve been looking for something like this for ages!

Is there anyway to easily add a “Forgotten Password” link? or have the form change to enter the username/email account?

Thanks
- pippin
  June 14, 2011
  
  That is not difficult to do. Take a look at this tutorial.
Arvs
July 28, 2011

Hi Pippin, I’ve been searching this feature for nearly months now, and I am so lucky to have stumbled upon your site. What I was looking for was actually to a code or much better if there’s a plugin wherein I can use the $_POST in PHP to get the WordPress user_login and user_pass user entry so I won’t have to make a separate login to access my own PHP script that I embed in WordPress that requires my users to login to be able to view their scores for example. Is there such way to do this? I would appreciate if you can lead me to the right track. Thanks.
- pippin
  July 28, 2011
  
  @Arvs – The only way I have found to do this so far is to add a line to the wp-login.php file that stores the $_POST[‘pwd’] in a $_SESSION variable. However, this is really not a good idea for two reasons: 1. it’s not a good idea to store the unencrypted password in a session variable, and 2. It’s never a good idea to modify WP core files.
Arvs
July 29, 2011

Hi Pippin, thanks, at least I know now the pros and cons of modifying the wp-login.php file. Thanks, I am on the right track now. 🙂
johnny perez
January 10, 2012

hey thanks. You saved me a lot of time! Keep up the great work! Johnny Perez.
Richard London
January 12, 2012

Can a shortcode be created for the registration form as well, for multisite?

Your site is really useful!, already bought a couple of your plugins!
- Pippin
  January 12, 2012
  
  I’ve already done it: https://pippinsplugins.com/front-end-registration-and-login-forms-plugins/ There is a tutorial listed on that page as well that will show you how to do it yourself.
V27DESIGNS
February 20, 2012

Thanks for the code and the short plugin version have made it even handy… thanks again.
Vince
March 1, 2012

Nice Plugin. I am sure it is doing what it is supposed to but I have an issue I cannot get beyond.

I used Wishlist Member which redirects every front-end login to a static page. I was hoping this plugin would allow me to embed the login in a partially protected post (where non-members cannot see the rest of the post until they login) and set the post link as the redirect. I can set all of that and the login displays in the post, but when I login using it, the site still takes me back to the home page–which is the default in Wishlist Member.

While I realize it is ‘their’ problem, I am wondering if you have any idea on how to get around this–my understanding is they encrypt their PHP so others online state there is no way to change their code.

Thanks in advance.
- Pippin
  March 2, 2012
  
  Does it work if you set the redirect parameter of the short code?
Vince
March 2, 2012

I set it like this (–loginform redirect=”http://my-redirect-url.com”–) and it did not work for me. Again, I think my Wishlist has hijacked all logins, but thought your re-direction might be a workaround.
Jon
March 19, 2012

Hi – I’ve been looking for this for a while – thanks so much for posting!!!

Two questions that came up as I added the code:
1. If a user is already logged in, is there a way to display some text that will only show up when they’re logged in? i.e. a link to the redirect page set in the shortcode

2. is there an easy way to display a ‘logout’ link on a page?

Thanks!
- Pippin
  March 20, 2012
  1. You can use the function is_user_logged_in() to check if a user is logged in or not. Something like this:
  1
  if(is_user_logged_in()) { echo 'this is displayed to logged in users'; }
  if(is_user_logged_in()) { echo 'this is displayed to logged in users'; }
  2. WordPress has a function to show the logout URL:
  1
  <a href="<?php echo wp_logout_url(); ? rel="nofollow">">Log out</a>
  <a href="<?php echo wp_logout_url(); ? rel="nofollow">">Log out</a>
- Kelsey
  December 16, 2012
  
  Hi !
  
  Where so I add the code below to your plugin??
  
  Thanks
- Kelsey
  December 16, 2012
  
  oops..
  
  Where do I add the code above to the plugin?
  
  Thanks
- Pippin
  December 16, 2012
  
  You could add it just above the return $form;

Jon

March 20, 2012

Great – thanks so much for your help! I think I’m very close to having this do everything I wanted. I really appreciate you posting the code and responding so quickly…

One other question – if a wrong username/password is entered on the custom login page, it redirects to the standard WP login page. How can I keep the user on the same custom page and display something like ‘wrong username or password’?

Thanks!

Pippin

March 21, 2012

There is a hook we can use to redirect to a specified page when there is a failed login.

function pippin_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('http://yoursite.com/login?attempt=failed'); exit;
     }
}
add_action( 'wp_login_failed', 'pippin_login_fail' );  // hook failed login

This will cause the user to be redirected back to your /login page with a query variable of “attempt=failed”. You can then use the query variable to display a “Failed to login” message.

Rob Booker
April 17, 2012

You are awesome. I appreciate that you took the time to build this and explain it.
- Pippin
  April 17, 2012
  
  You’re welcome!
Martis78
May 4, 2012

For logout redirect Try code
wp_logout_url($redirect_url)
And dont forget move extract function outside of IF
JJHerman
May 28, 2012

I’m sorry, but where are we supposed to place this code/file?
- Pippin
  May 29, 2012
  
  You can place it in your theme’s functions.php.
Bryan
July 27, 2012

Hi Pippin,

Thank you for this awesome plugin. I’m having some trouble getting the form to re-direct after logging in though. For some reason, it keeps bringing the users to the dashboard instead of back to the page they’re trying to access.

I’ve copied and pasted the plugin line-for-line into my functions file. Do you have any suggestions?

Thanks in advance.
- Pippin
  July 27, 2012
  
  Did you add the redirect parameter?
Menard
September 11, 2012

Hi sir,

Is there a way to embed Captcha [SI Captcha Anti-Spam] for this plugin

Thanks
- Pippin
  September 11, 2012
  
  Not without modifying the plugin.
- Menard
  September 11, 2012
  
  how can I do it sir?
- Pippin
  September 11, 2012
  
  Are you comfortable with custom PHP?
- Menard
  September 11, 2012
  
  I have a knowledge in PHP. can you guide me on how can i embed Captcha in login form using your plugins?
  
  thanks.
- Pippin
  September 12, 2012
  
  Oh, I just realized you were asking about the specific SI Captcha. Sorry, I do not know about that.
  
  I have done reCaptcha integration. Interested in that one?
- Menard
  September 13, 2012
  
  sure, as long as it ontegrates with the login form.
  
  thanks.
- Pippin
  September 13, 2012
  
  Check out the docs on reCaptcha and then let me know if you have specific questions: https://developers.google.com/recaptcha/
- Menard
  September 13, 2012
  
  Hello,
  
  I tried to modify my wp-login.php code and integrate the codes from google’s reCaptcha docs
  
  but it doesnt appear the captcha validation..
  
  am I doing it on the right track?
  
  thanks!
- Pippin
  September 14, 2012
  
  Do not modify wp-login.php. You should only modify the plugin file itself.
- Menard
  September 14, 2012
  
  how? 😀
- Pippin
  September 14, 2012
  
  I can’t give you step by step instructions (that’d be a full tutorial), but if you show me what you have tried, I can tell you if you are on the right path.
Filt
September 13, 2012

Awesome, dude. But here comes the million-buck question: how do you keep the user on the same page if the login fails? I don’t want to bring forth the awful WordPress login page, which defeats the whole purpose. Would it be possible execute the whole login process without ever seeing the ‘wp-login.php’ screen, and displaying the errors (‘wrong password, empty fields, etc) right there and then? Thanks, and good luck.
Filt
September 13, 2012

Sorry, dude. My bad for not reading ALL the comments… Feel free to delete, and thanks once more.
Filt
September 13, 2012

Okay, third time’s the charm. 🙂 I have absolutely no idea how to implement the (vague) solution you suggested to Jon, so I guess my first reply is still valid: How to manage the whole login from the shortcode, without ever going to wp-login.php? Regards.
- Pippin
  September 13, 2012
  
  Take the code snippet I gave to Jon and paste it into the bottom of the plugin file (of this plugin). That’s all you need to do.
B£achy
October 29, 2012

I love you for this. 🙂
PJ
November 4, 2012

thanks for this amazing…but what happened to logout?
- Pippin
  November 5, 2012
  
  I’d suggest using the admin tool bar. When a user is logged-in, there will be a logout link in the menu in the top right.
jaypee
November 28, 2012

i simply love this plugin. thanks a lot bro..
Nora McDougall-Collins
December 2, 2012

Nice little plugin! I intend to show it to my WordPress programming students as a model. However, I have noticed one little glitch.

The situation is that we have a certain login form for speakers to use to upload their presentation materials to the media library. When I use the plugin, it always redirects to the main dashboard instead of the media library address I added in the redirect. I have tried it with the fully qualified domain name in the shortcode and without it.

I have noticed that other people have had a problem with using the redirect parameter with wp_login_form()
- Pippin
  December 2, 2012
  
  Can you show me an example?
- Nora McDougall-Collins
  December 2, 2012
  
  Sure! http://westernforestry.org/Events/wp-admin/media-new.php The form is in the lower right hand corner. However, others are having similar problems with the redirect parameter; so, it may not be anything to do with the plugin.
- Pippin
  December 4, 2012
  
  Can you give me a sample user login and password to test?
- Nora McDougall-Collins
  December 5, 2012
  
  My client has OK’d it, but how do I send it to you without putting it in a public forum?
- Pippin
  December 6, 2012
  
  Use my contact page.
timDesain
December 27, 2012

Nice custom login and combined with custom post type for the message

http://bisnisukm.com/wp-login.php
Phil Johnson
April 22, 2013

I have installed and activated your plugin. What code do I need to insert into the page to get it to work?
Thanks
- Pippin
  April 23, 2013
  
  Just [login_form]
Irfan
July 19, 2013

I have installed your plugin and activated it. When i enter [login_form] into my page it just shows the shortcode itself instead of login form. Can you please correct me where i am making mistake?
- Pippin
  July 20, 2013
  
  Where did you put it?
stuart
September 25, 2013

Hi this is just what I need, have been messing around for ages. I am just having problems adding in the logout code. I can add the text message. but when I try and add the line
<a href="”>Log out underneath it and before the return $form; i get a server error indicating that line. I am probably leaving out some syntax perhaps you could tell me what.
thanks Stu
- Pippin
  September 25, 2013
  
  What’s the exact error?
stuart
September 25, 2013

Hi, I don’t want to recreate the error because I am doing this on a live site and it crashed the site with something about unrecognised function??(maybe)
If I show you what I used as far as the code then it will probably stand out a mile that i forgot something.
//pippins version which includes logout
function pippin_login_form_shortcode( $atts, $content = null ) {

extract( shortcode_atts( array(
‘redirect’ => ”
), $atts ) );

if (!is_user_logged_in()) {
if($redirect) {
$redirect_url = $redirect;
} else {
$redirect_url = get_permalink();
}
$form = wp_login_form(array(‘echo’ => false, ‘redirect’ => $redirect_url ));
}
if(is_user_logged_in()) { echo ‘this is displayed to logged in users’; }
<a href="”>Log out
return $form;
}
add_shortcode(‘loginform’, ‘pippin_login_form_shortcode’);

Thanks
stu
September 29, 2013

stuart

September 25, 2013 at 11:12 pm

Sorry It wasn’t like that, the line below the message to logged in users was as your code,

//pippins version which includes logout
function pippin_login_form_shortcode( $atts, $content = null ) {

extract( shortcode_atts( array(
‘redirect’ => ”
), $atts ) );

if (!is_user_logged_in()) {
if($redirect) {
$redirect_url = $redirect;
} else {
$redirect_url = get_permalink();
}
$form = wp_login_form(array(‘echo’ => false, ‘redirect’ => $redirect_url ));
}
if(is_user_logged_in()) { echo ‘this is displayed to logged in users’; }
<a href="”>Log out
return $form;
}
add_shortcode(‘loginform’, ‘pippin_login_form_shortcode’);

Thanks
Vincent
October 18, 2013

I want to modify the “Username”, “Password” and “remeber me” labels…how can I do that?
thank you
Vincent
- Pippin
  October 19, 2013
  
  Are you comfortable modifying the PHP files?
- Vincent
  October 20, 2013
  
  Yes, if you tell me what to write…
- Nora McDougall-Collins
  October 19, 2013
  
  Here are the references I used:
  http://codex.wordpress.org/Function_Reference/wp_login_form
  http://codex.wordpress.org/Customizing_the_Login_Form
  
  One thing I do when I’m digging into WordPress code is add comments. IMHO, if WordPress developers want to follow best practices, they would add more comments.
de Alwis
November 15, 2013

Hi,

Thank you very much for this plugin. I see lot of people have benifited. I have installed and activated the plugin. I have few issues.

1) I have 2 pages “Login” & “Register” in my main navigation which I want only to display to visitors who are not logged in and how do I do thta.

2) I have added the [login_form] shortcode to my login page but it only shows the shortcode without the login page.

3) If you know how I could do the above please let me know where I should insert the codes ? is it in function.php?
- Pippin
  November 15, 2013
  
  1). Check out the Nav Menu Roles plugin.
  
  2). Show me a live URL.

Comments are closed.

WordPress Login Form Short Code

97 thoughts so far

Have your say

Leave a reply

Join the discussion