If you want to take your site to a new level and add a touch of personalisation to your WordPress install, you can replace the default WordPress logo on the login page with your site’s logo. This following snippet changes the default logo to your site icon (as defined in Settings > General > Site Icon). Simply place the following code in your site’s functions.php file (make sure you are using a child theme to protect against theme updates).
/** change the WordPress logo on the login page to the site icon */
function denial_login_logo() {
/** Get the site icon and store it in a variable
* first parameter is size, change this to match your desired dimensions,
* second parameter is a fallback url, set to the default WordPress icon, if the site icon is not set,
* the third is the blog_id, used for multisites, 0 for default or single sites */
$fallback_logo = get_site_url() .'/wp-admin/images/wordpress-logo.svg';
$site_logo = get_site_icon_url(84, $fallback_logo, 0);
/** change the login stylesheet to use the site icon */
?>
<style>
#login h1 a {
background-image: url(<?php echo $site_logo ?>);
background-repeat: no-repeat;
background-size: 84px; /* change this to match your desired dimensions */
height: 84px; /* change this to match your desired dimensions */
width: 84px; /* change this to match your desired dimensions */
}
</style>
<?php
}
add_action('login_enqueue_scripts', 'denial_login_logo');The default WordPress logo on the login page is loaded as a background image so in order to replace the image we need to set our own background image which is done by inserting our own css stylesheet in to the login_enqueue_scripts hook. Using the get_site_icon_url function we can get our site icon url and add that to our new stylesheet. You can adjust the icon size and the padding / margins around the icon here as well.
