How To Add Your Company Logo To The Wordpress Login Page

We get asked this a lot: how to add your company’s logo to the backend login page for WordPress. It makes the whole thing look more prefessional, and in turn, makes the whole thing a lot more appealing to a lot of our clients who have more than one admin or shop manager. The procedure is quite simple, just a few lines of code, the logo in the proper size and you’re done.

Step 1 – Create a properly sized logo, and upload it to your website

The logo is the first thing you’ll need, and it will need to be uploaded to your website. For logos and some general assets for our client’s sites, we tend to add them to the assets folder within the theme itself. This solves a potential future issue where a logo needs to be updated, so it’s easily found and replaced, without the hassle of going through thousands of files in the YY/MM folder. In turn, whenever you wish to change it, simply upload the new version. That’s it!

Step 2 – Add the below code to your functions.php page

/* Add Unplugged performance logo to Login page */

function nucleus_login_logo()

{ ?>

<style type="text/css">

#login h1 a,

.login h1 a {

background-image: url('/wp-content/themes/unpluggedperformance/assets/up-black-logo-1.png');

height: 65px;

width: 305px;

background-size: 305px 65px;

background-repeat: no-repeat;

padding-bottom: 30px;

}

</style>

<?php }

add_action('login_enqueue_scripts', 'nucleus_login_logo');