It’s nice to have something that you can call your own. For your house, it starts with a doormat, and for your WordPress website it starts with putting a logo on your wp-admin login page.Now I know what you might be thinking.

"Why should I care about the aesthetics of a part of the website that no one else but I will be seeing?"

Your website plays an important role in building your brand and business. So why not remind yourself of that fact when logging in?Here at TECKpert, we do a bit of branding for our clients’ WordPress websites in the backend before launching. It gives our clients a sense of ownership and it’s a neat personal touch, like a doormat saying “Welcome.”So without further ado, I’ll show how to accomplish this!

1. Upload logo

First off, drop your logo in the images directory of your WordPress theme (‘yourtheme/includes/images/’). It should preferably be a PNG with a width of 274 pixels and a transparent background. Name it “login-logo.png” for the sake of this example.

2. Create an admin stylesheet

Step one, make a new custom stylesheet file titled “admin.css” and drop it in the following directory: ‘yourtheme/includes/css/’Now add the following code to your stylesheet:#login h1 a{background: url('../images/login-logo.png') no-repeat scroll center top transparent;}

3. Create filters and actions in functions.php

Once you’re done with that, copy and paste this code into your theme’s functions.php file:/*** Function: admin_login_url* Description: Updates the URL for the logo on the WordPress admin login page* */function admin_login_url($url){return get_bloginfo( 'url' );}add_filter('login_headerurl', 'admin_login_url');/*** Function: admin_css* Description: Adds a custom stylesehet to be included in the login.* */function admin_css() {wp_enqueue_style( 'admin_css', get_template_directory_uri() . '/includes/css/admin.css' );}add_action('login_head', 'admin_css');This function makes sure that your stylesheet is only being loaded when you are in the login screen of the site. Nothing special, just a little efficiency.

And you're done!

Afterward, navigate to yoursite.com/wp-admin and presto, your login page is branded. Now even though your website is built on some really awesome content management software you didn't make, it feels more like home!For the more advanced, you can take it a step further even and quickly change the background color of the page and other elements.Want to learn more? Get in touch with a Web Expert