How to Display WordPress Login Form in the Sidebar

The one page WordPress site administrator’s use the most is the login page. And most of us have tried to customize the look of that page in one way or another. However, despite providing a custom look, the login page does not always have to be a separate page.

On the contrary, you can easily put the login form in the sidebar. By doing that, you will be providing a simple log in solution for your visitors. The users will also feel encouraged to register into your site once they see the log in form.

Choosing the Plugin

While it is possible to add the log in form manually, we won’t go into that much hassle. Being a proud WordPress user, we have lots of third-party plugins for that purpose. For this tutorial, I will use Sidebar Login, an absolutely free plugin with more than seventy thousand active installs at this moment.

Initial Setup

After installing and activating the plugin, go to Appearance > Widgets from your website dashboard. On that page, you will find a new widget titled ‘Sidebar Login’. Drag and drop the widget to your desired location.

sidebar-login-1

If you save the widget without making any changes and reload your website, your sidebar should have a new section like the following –

sidebar-login-2

Personalizing the Widget

The login form already looks great. But Sidebar Login offers lots of customization options too. Now, let’s see what the customization options are.

To do that, get back to your website dashboard and go to the widgets page. In the editing pane of the widget, the first option you have is the title that will be displayed when you are not logged in.

sidebar-login-3

After the logged-out title, you will find three options to choose whether to show the lost password link, show register link and show the ‘Remember me’ checkbox. In order to allow new user registration, you need to check the ‘Anyone can register’ box from the Settings > General page.

In the Login Redirect URL, you can specify the location where the visitor should be taken to once he has logged in. Like the logged out title, you can also set a title for the logged in condition. To do that, provide the title in the ‘Logged-in title’ section.

Then, in the ‘Links’ section, you can provide custom links that will be displayed when a user is logged in. However, there are some special rules for adding links. We will talk more about the rules later.

If you want to display the user avatar, make sure that the ‘Show logged-in user avatar’ box is checked. Lastly, you can specify a page where the users will be redirected once they log out from the website. To do that, provide the link in the ‘Logout Redirect URL’ field.

Adding Custom Links

Now, let’s see what the special rules for adding custom links are. For adding links, you have following options which are called tags –

%username% – Displays the username of currently logged in user

%userid% – Displays the user ID of currently logged in user

%admin_url% – Displays the dashboard URL

%logout_url% – Displays the logout url

%buddypress_profile_url% – Displays the Buddypress Profile URL

%bbpress_profile_url% – Displays the bbPress Profile URL

For the last two links to work, you should have BuddyPress and bbPress installed in your website. To use these tags, you have to follow a special format.

sidebar-login-4

In the above image, the specified format is – Text | HREF. Here, Text is the link name and HREF is the tags I discussed above. So, if you want to display a link to the dashboard, you have to write in this way –

Dashboard | %admin_url%

Don’t forget to click ‘Save’ after making all the changes. And if you are still confused about using the plugin, let me know by leaving a comment below. I will be glad to help you.

So, what do you think about Sidebar Login? Also let me know if you think there is a better alternative. I will be glad to take a look. 

Foysal Ahmed

Leave a Comment