How to Change WordPress Login Logo with WordPress 5.x in 2021

Every now and then, due to branding requirements, we need to place brand logos everywhere where needed, and WordPress login Logo is no exception. If you are only person using the login or have clients, Team members using the same, with your logo on the login is must for all.

So, let us see how easy it is to change WordPress login logo

WordPress by default comes with Own Logo on the Login page, and it is easy to change the Logo. There are multiple ways to change the logo on Login page both with code and without code with help of plugin.

In the first part of the post we will focus on the plugin, to change WordPress Login Logo easily considering the users who do not want to play around the code , second, we will look at code option, and finally which is the preferred way to go forward.

How to change WordPress login logo the Plugin WAY:

There are multiple plugins for enabling us to change WordPress Login Logo as you can see from the below screenshot, some of them go beyond just changing Login Logo to fully white label things.

Here we will just discuss about change WordPress Login Logo to  

While we tried couple of plugins, We will follow currently Custom Login Page Customizer plugin by  Hardeep

Here is how to get it going:

  • Install & Activate the plugin form the WordPress -> plugins
  • Change the desired settings for Login customizer, here Login Logo following WordPress -> Appearance -> Login customizer
  • On the Customizing Login Customizer Logo screen click on “Select image” under Logo, to choose your preferred logo to replace the existing WordPress Login Logo.
  • Once selected, change the Logo URL in the same setting to point to your website, which might by default point to WordPress website
  • Finally, if you do not need to change the size of the Logo click “Publish” to publish the settings.

Validation the changes done for WordPress Login Logo

Visit the WordPress Login page of your website from another browser and see validate that you can view your custom logo in place of default WordPress Logo.

How to change WordPress login logo the code way:

Note: This way of changing Logo has its own risk, you might corrupt the existing code file which will need modification, resulting in broken or non-working website. – You have been warned

For this we will be add code to WordPress current active Theme’s functions.php file.

The functions.php of the active theme can be located under the path WEBROOT\wp-content\themes\THEMENAME\

  • Locate the functions.php from the above said location,
  • Download using the FTP client to your local system for editing.
  • Make a copy of functions.php file before editing, so you have backup if anything goes wrong.
  • Add below code toward the end of the file
function my_login_logo() { ?>
    <style type="text/css">
        #login h1 a, .login h1 a {
            background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/images/site-login-logo.png);
		height:65px;
		width:320px;
		background-size: 320px 65px;
		background-repeat: no-repeat;
        	padding-bottom: 30px;
        }
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );

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

function my_login_logo_url_title() {
    return 'Your Site Name and Info';
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' )
  • Save the file, and upload it back.
  • Upload your new changed WordPress Login logo to images folder of the themes image folder WEBROOT\wp-content\themes\THEMENAME\images . If the images folder does is not present create one.
  • Rename the newly uploaded logo file to “site-login-logo.png”

Validation the changes done for WordPress Login Logo with the code:

Visit the WordPress Login page of your website from another browser and see validate that you can view your custom logo in place of default WordPress Logo.

Confused on How to get it going? broke your website while doing the same? Get it fixed quickly with 24/7 WordPress website management and support services @assistwp24x7. We provide awesome WordPress Website services for website owners, freelancers, agencies, small businesses, startups and WordPress blogs! Check our WordPress Website Management care plans

Get in touch with WordPress support Specialist
for:
* Help with your Website’s ongoing maintenance
* Help with your Website’s Ongoing security
* Finding your Website’s Optimal care plan
* For AssistWP24x7 WordPress Specialist