To customize the WordPress logo on the login screen you can utilize the login_headerurl and login_headertext filters. These filters allow you to modify the logo URL and text displayed on the login screen. Here's an example of a WordPress function that replaces the default WordPress logo with a custom logo:
By adding this code to your WordPress theme's functions.php file or a custom plugin, users will see a customised page when attempting login.
Custom login logo
The custom_login_logo function injects inline CSS to display the custom logo. This ensures that the custom logo is used as the background image for the h1 element on the login screen, achieving the desired logo replacement.
function custom_login_logo() {
echo '<style type="text/css">
.login h1 a {
background-image: url("https://example.com/path/to/custom-login-logo.png") !important;
width: 100% !important;
background-size: contain !important;
}
</style>';
}
add_action('login_enqueue_scripts', 'custom_login_logo');
Custom login logo url
The custom_login_logo_url
function modifies the URL that the logo should link to, in this case it is hard coded to a URL
function custom_login_logo_url() {
return 'https://example.com/'; // Replace with the desired URL
}
add_filter('login_headerurl', 'custom_login_logo_url');
Custom login logo text
The custom_login_logo_text function changes the text displayed next to the logo. It sets the text to 'Your Site Name' in this example, but you can replace it with any desired text.
function custom_login_logo_text() {
return 'Your Site Name'; // Replace with the text you want to display instead of WordPress
}
add_filter('login_headertext', 'custom_login_logo_text');