How to Change Logo on WordPress Login Page

A few weeks ago I received a message from one of my many video tutorials questioning the ease of customizing the WordPress login page — specifically how easy is it to change or replace the WordPress logo.

So back to the tutorial cave I went to discover how it’s relatively easy to replace the out-of-box WordPress login page logo.

Changing WordPress Login page logo by hand

Before you click back to search results or venture over to another website due to sheer terror, please give me a moment to show and discuss how easy it is to change the default logo on the WordPress login page (see below).

The file to find and modify is found within your themes folder, which is often the /wp-content/themes/name-of-theme directory (i.e. “name-of-theme” is actual name of your active theme).

Within the given theme directory, locate the functions.php file and add the following code to the very bottom of the file.

Copy and Paste Code for Custom WordPress Login Logo

<?php function my_custom_login_logo() { ?> </p> <style type="text/css"> <p>body.login{ background: #fff; } body.login div#login h1 a { background-image: url(http://your-logo-url.png); //Add your own logo image in this url padding-bottom: 30px !important; background-size: 320px !important; height: 120px !important; width: 320px !important; } </style> <p><?php } add_action( 'login_enqueue_scripts', 'my_custom_login_logo' ); ?>

Be sure to change the url in the code above to be the url of your website’s logo — up your logo using WordPress Media Library and use the assigned link associated to uploaded logo.

In short, the code above uses PHP and CSS to change the location of your logo as well as change a few CSS attributes to the login page such a background, padding, and the width and height of the logo.

If you only were to change the logo itself using only the CSS background-image attribute, then your logo would appear as the image below.

Adding the CSS padding and background attributes creates a more seamless, sleek, and branded login presence (see updated image below), especially when using WordPress to gate content from visitors.

And of course, there’s a plugin…

If you’re like the more than 30% of website owners using WordPress, then you’ve likely come to realize that there is a plugin for nearly anything under the sun pertaining to WordPress.

Changing the WordPress login page logo is no exception either. There are quite a few plugins available to try out, but the one I recommend the most is My WordPress Login Logo.

While other plugins have not been updated in years or they require a bit more hand holding, the My WordPress Login Logo is quite easy to use.

Simply install it, upload your logo, set the dimensions, set a url link, and you’re done and ready to move onto to your next task — having a sleekly branded WordPress login page to match your web presence.

To learn more about how to use My WordPress Login Logo change or replace the WordPress Logo, please watch my quick 5 minute tutorial below.

Also, please don’t hesitate to send me questions or comments about any of the topics I’ve mentioned above.

Related articles:

How to Auto Publish WordPress Posts to Facebook 3 security tips to reduce WordPress url spamming WordPress Tutorial: Exclude Post Categories and Include Same Category Next/Previous Links. Quickly Display WordPress Posts by Blog Category in Page or Post