Search
Close this search box.

How to change the login logo in WordPress

How to change the login logo in WordPress

Changing the logo on wp-login.php is easy to do with the use of the functions.php file in WordPress. First, you will need to upload the new logo image to your WordPress site. Once the logo has been uploaded, you will need to add a line of code to the functions.php file to call the logo. This line of code should include the path to the logo image. Finally, you will need to add a small piece of CSS code to the functions.php file to make the logo appear on the wp-login.php page. After all of these steps are completed, the logo should be changed and the new logo should appear on the wp-login.php page.

To change the logo in the WordPress login page, you can use the login_headerurl and login_headertitle filters in your theme’s functions.php file. Here’s an example of how to use these filters to change the logo and add some custom CSS to style it:

// How to change the login logo in WordPress
// More snippets at wpunplugged.com

function custom_login_logo() {
    echo '<style type="text/css">
        #login h1 a {
            background-image: url('.get_stylesheet_directory_uri().'/images/custom-login-logo.png) !important;
            background-size: contain !important;
            width: 100% !important;
        }
    </style>';
}
add_action('login_head', 'custom_login_logo');

function custom_login_logo_url() {
    return home_url();
}
add_filter('login_headerurl', 'custom_login_logo_url');

function custom_login_logo_url_title() {
    return get_bloginfo('name');
}
add_filter('login_headertitle', 'custom_login_logo_url_title');

In this example, custom_login_logo() is a function that adds a custom CSS rule to the login page to change the logo to a custom image (custom-login-logo.png) located in the theme’s images directory. custom_login_logo_url() is a function that returns the home URL of the site, which is used as the link for the logo. And custom_login_logo_url_title() is a function that returns the site name, which is used as the title attribute for the logo link. To use this code, simply add it to your theme’s functions.php file and replace custom-login-logo.png with the path to your custom logo image.

Share this post

You might also like...