Customize the WordPress Login Page

I love WordPress and am personally very happy to see the WordPress logo when I log into a site, but when building sites for some clients (and on my own development site where I build sites for clients to preview), it is nice to use their own logo for the login page. It gives a more professional look and fits in with the rest of their branding.

This snippet will use a custom logo instead of the WordPress default logo.

1. Upload your logo to the server, either manually or through the WordPress media library. It is best if the logo image is 326px x 82px or smaller.

2. In your theme’s functions.php file, add this code:

// login page logo
function custom_login_logo() {
    echo '<style type="text/css">h1 a { background: url('.get_bloginfo('url').'/PATH_TO_IMAGE/YOUR_IMAGE.png) 50% 50% no-repeat !important; }</style>';
}
add_action('login_head', 'custom_login_logo');

Replace PATH_TO_IMAGE/YOUR_IMAGE.png with the path to your logo image, i.e. images/logo.png.

To customize the entire login page (including the logo), you can use a similar function to call a custom stylesheet for the login page:

// custom login page
function custom_login_page() {
	echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/customlogin.css" />';
}

add_action('login_head', 'custom_login_page');