How to Get a Custom WordPress Login Page

Getting a custom WordPress login page is certainly a cool thing! It’s basically the last step on your way to white-labeling your WordPress website entirely.

👉 Two reasons why you might want to get a custom WordPress login page:

The obvious reason … branding. With your logo featured right above the login form, your website no longer looks like something put together in an afternoon, but like a completely custom-built creation.
Security. Having an additional security check on your WordPress login page will prevent hacker attacks and bots trying to break in.

There are plenty of ways to get a custom WordPress login page. For advanced users, you can change the WordPress logo and URL using code. However, this requires you to edit important site files which beginners might not be comfortable with.

Instead, you might prefer to use free or premium plugins to do this. To be honest, this is really easy, no matter which method you choose.

We’ve picked 3 of the most popular login customizer plugins around, installed them, and experimented with each one to show you how to quickly customize your WordPress login page. Plus, we’ll also show you how to do this manually if you don’t want to rely on plugins.

Custom Login Customizer
Custom Login Plugin
Custom Login Creator – Login Page Styler
Change the WordPress login logo with code

Learn how to get a custom #WordPress login page using this tutorial 🧑‍💻

Click To Tweet

From our own catalog, this is a great free plugin. It is very easy to use and provides an awesome live customizer for your WordPress login page, so you can see exactly how the final result is going to look like in real time.

Using this plugin is really simple. All you need is to install it in your dashboard and activate it.

Then, go to Appearance » Login Customizer » Start Customizing!

The live customizer will open up, letting you do all the changes inside the sidebar to the left, and see the live preview to the right. Click on Login Customizer and start picking your desired options.

You can upload your logo and set its size, choose a background color or image, pick the login form’s background and size, the styling of the individual fields, the login button appearance, the colors, and you can even add custom CSS.

I played around a little bit, and this is what I got:

A popular WordPress login page customization plugin. It comes with an intuitive and friendly interface that lets you have a lot of fun while customizing your WordPress login page. Custom Login Plugin provides you with a very detailed range of options overall.

Just install the plugin, activate it, and go to Settings » Admin Custom Login. Enable the custom login and start experimenting with the customization variants offered by the plugin.

There are lots of options here. You can change the background color and image, use a background slideshow for both the general background and the one inside the form. You can use up to 6 sliders, and you can also pick transition effects.

You can also add custom social icons and import/export the plugin’s settings from/to somewhere else. Overall, a very friendly and playful experience with this plugin. Here’s what I’ve managed to get:

Note. You need to click on “Save Changes” every time you customize a certain tab.

A great and super friendly plugin when it comes to customizing your WordPress login page, being one of the highest rated plugins in its field. It has a playful and intuitive settings page, and offers lots of great options.

Install the plugin, and look for “Login Page Styler” in your dashboard menu.

But there’s a problem. 🤷‍♂️

Despite its greatness, it also has many restrictions. For instance, you can’t use background images if you don’t switch to the pro version. You can’t change the login form position, opacity, the hover settings for the buttons, the logo size, and many other things like that.

Overall, the final result looks modern and engaging. But the restrictions in the free version make this plugin a little less functional than the two other ones here.

While plugins provide a simple way to customize the login page, experienced users might prefer to use code. This means replacing the WordPress logo with a custom logo (and changing the logo link) manually.

First, you’ll need to upload your own logo to the WordPress media library by going to Media » Add New. Then, click on Select Files and choose an image from your computer.

Once the image is uploaded, click on Edit in the bottom right corner:

How to manually create a custom login page

To the right of your screen, find the File URL and make a note of this for later:

Now, you’re ready to add some code to your theme’s functions file. This can be a bit risky since a single error can break your website. Therefore, before you begin, it’s always a good idea and general best practice to backup your site first.

In addition, you’ll want to use a code snippets plugin like WPCode to edit your website safely. After activating the plugin, go to Code Snippets » Add Snippet:

Find the Add Your Custom Code option and select Use snippet. Give your snippet a memorable title:

Then, enter the following code into the Code Preview box:

function wpb_login_logo() { ?>
    <style type="text/css">
        #login h1 a, .login h1 a {
            background-image: url(http://path/to/your/custom-logo.png);
        height:100px;
        width:300px;
        background-size: 300px 100px;
        background-repeat: no-repeat;
        padding-bottom: 10px;
        }
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'wpb_login_logo' );

You’ll also need to change the Code Type to PHP Snippet, and replace the URL with the file URL that you copied earlier. Then, activate the snippet at the top of the page and click on Save Snippet.

Now, it’s time to change the logo link, as it still points to WordPress.org. Paste the following code beneath the code that you’ve just added:

function wpb_login_logo_url() {
    return home_url();
}
add_filter( 'login_headerurl', 'wpb_login_logo_url' );

function wpb_login_logo_url_title() {
    return 'Your Site Name and Info';
}
add_filter( 'login_headertext', 'wpb_login_logo_url_title' );

You’ll need to replace "Your Site Name and Info" with the name of your WordPress site. Then, click on Update. Now, your custom logo will lead visitors to your homepage.

Go to top

After experimenting with all methods, I loved the way Custom Login Creator worked in the back-end. I loved how easily you can customize everything and the fact that it offers a modern, playful design.

Learn how to get a custom #WordPress login page with this tutorial 🧑‍💻

Click To Tweet

But. ☝️

If you don’t want to use a plugin to get a custom login page, it’s relatively straightforward to use code to manually replace the logo and link.

That being said, Custom Login Customizer has a lot of awesome features. First of all, it lets you customize your WordPress login page live, so you can see what it looks like after every small change you make, without having to open another tab to see the results separately. Secondly, there are security features available if you’re willing to buy the add-on.

So, if you’re looking for a more functional solution that gives you a lot of stuff for free, Custom Login Customizer will suit you perfectly.

But of course, since all three plugins are free (in their standard versions) I encourage you to check them all out and see for yourself which one will give you the best custom WordPress login page. For even more options, make sure to check out our post on the five best WordPress login plugins.

Have you tested any of these? Tell us what you think about them.