Fed up with the built-in WordPress login form? It works fine when you’re the only one who needs to log in. But if you let other people register at your site, you might be looking to create a custom WordPress login form to offer a better, more branded user experience.
If that’s the case, you have plenty of options for how to create a custom login page for WordPress. And I’m about to show them to you!
In total, here’s what I’ll cover. How to…
- Add a login form to any page with a shortcode or using a sidebar widget. You’ll also be able to redirect users to a custom page after they log in.
- Add social login buttons anywhere on your site via a shortcode or sidebar widget
- Customize the native WordPress login page (wp-login.php)
And whenever possible, I’ll try to stick to free plugins!
Method 1: Clean Login Plugin (Free)
There used to be a popular custom login page plugin called Theme My Login. However, in June 2018, that plugin suddenly started charging money for all kinds of features that were previously free (not cool!), which forced me to look for some Theme My Login alternatives for this post.
After playing around with a few different plugins, I settled on the free Clean Login plugin and the plugin in the next section as the two best options.
Clean Login gives you simple shortcodes that help you add the following forms/information anywhere on your site:
- Login form
- Register form
- Restore password form
There’s also a basic frontend profile management shortcode if you want to let users manage their profiles, though you don’t have to use that feature.
To use the plugin, just install and activate it. Then, simply add the
[clean-login] shortcode wherever you want your custom login form to appear:
If you go to Settings → Clean Login, you can also choose to redirect users to a specific page after they log in (or log out):
All in all, pretty easy to use!
Method 2: Login With Ajax Plugin (Free)
Login With Ajax is another stellar free option and a great Theme My Login alternative.
It lets you add a custom login form to WordPress using either a shortcode or a widget (there’s also a PHP option for developers).
Here’s what I like about this option:
First, because it uses AJAX, there are no screen refreshes, which is a neat effect (there’s also a fallback in case AJAX doesn’t work).
Second, you can not only set up custom redirects for after a user logs in, but you can also set up different redirect rules depending on a user’s role.
To get started, install and activate the free plugin. Then, you can add your login page using either:
- The Login With Ajax widget
As you can see, it’s a bit wider than the Clean Login plugin and lacks the box/shadow around the form by default:
If you want to change the width, it’s a pretty easy CSS fix – just adjust the width of the
You can also set up your custom redirect rules by going to Settings → Login With Ajax:
And another nice thing that Login With Ajax lets you do is set up a custom email that users get after registering, if you’re using the custom registration page functionality.
Method 3: Use The Elementor Pro Login Widget ($49)
Again – this widget is only available with Elementor Pro (read our review). But once you have that, you can easily add a login form anywhere on your site by using the Login widget (you can even embed this in your sidebar by using the Embed Anywhere feature in Elementor Pro).
To use it, just drag over the Login widget and style it using the Elementor side panel:
You can also use the Additional Options section in the Content tab to set up a custom redirect after a user logs in:
This is probably the most flexible way to create and style a custom login page – you’ll just need to pay for Elementor Pro to use it.
Method 4: Add Social Login With Nextend Social Login (Free)
So far, I’ve just shown you how to add a basic custom login page. But what if you want to make it custom…’er with something like social login?
If so, you can use the Nextend Social Login plugin to add social login anywhere on your site using either shortcodes or the included widget.
And like the other plugins, you’re also able to set up custom redirects for after a user logs in.
I’m not going to give you any tutorial for this section because I’ve already covered how everything works in my detailed Nextend Social Login review. So if this method intrigues you, make sure to check that post out!
Method 5: Customize The Native WordPress Login Page
Finally, I want to touch on the fact that there are lots of free plugins that can help you customize the native WordPress login page, rather than needing to create your own login page.
These plugins let you re-skin the wp-login.php page while preserving all the same functionality. Typically, you’ll be able to change:
- The default WordPress logo into your own logo
- Colors and backgrounds
- Form labels and placeholders
And some plugins also give you other options.
If you’re interested in this approach, check out our post on the best custom login page plugins.
Final Thoughts On How To Create A Custom WordPress Login Page
If you want to create a custom login page form that you can embed in your content or sidebar, both Clean Login and Login With Ajax are great options.
Each plugin not only lets you add a login form anywhere on your site, they can also help you set up custom redirects to send visitors to the right spot after they log in.
Additionally, if you’re one of the many angry Theme My Login users, they both make great Theme My Login alternatives.
If you already use Elementor Pro on your website (like WPLift does), you don’t need any external plugin because you can already use the flexible Login widget. And like the previous two plugins, Elementor Pro lets you set up a redirect for after a user logs in.
Finally, if you want to add social logins to any spot on your site, Nextend Social Login gives you both shortcodes and widgets. And if you’d prefer to stick with the native WordPress wp-login.php page, you can also find plenty of plugins to help you customize its style.
Now over to you – have any other questions about how to create a custom login page for WordPress? Leave a comment and we’ll try to help you out!