WordPress Tutorial: Custom Login Logo

Creating a branded experience for your clients is important as it adds value to the finished product and makes the user experience more refined.

The standard WordPress admin login panel uses a generic WordPress logo which links to WordPress.org. This isn't ideal as it is confusing for editors and users alike.

By adding the following code to your themes functions.php file you can provide your own logo which links to the your sites home page.

add_action('login_head',  'custom_login_logo');
function custom_login_logo()
{
    echo '<style type="text/css">body.login{ background: #fff; } #login{ padding: 40px 0 0; } .login h1{ margin-bottom: 20px;} .login h1 a {  background-image:url(' . get_template_directory_uri() . '/style/images/logo.png)  !important; background-size:268px 52px; padding-bottom: 0; } </style>';
}

// CUSTOM ADMIN LOGIN LOGO LINK
add_filter('login_headerurl', 'login_url');
function login_url()
{
    return site_url();
}

Simply change the location and dimensions in the code to match your site's logo and away you go!