How to Remove WordPress Logo from Login Page

By default, in WordPress when you go to your admin login page, you’ll get a login form with the WordPress logo on top of it. Some of you may feel the need to remove or change the WordPress logo from your WordPress login page since maybe you want to have a clean login page or you want to replace the logo with your own logo.

This time, we will show you how to remove the WordPress logo from the login page and how to change the logo to your own logo.

To Remove or Change the WordPress Logo

Once you’ve decided to remove or change the logo on your WordPress login page, there are two methods we will use in this tutorial:

• Using a WordPress plugin
• Using a custom code

Method 1: Using a WordPress Plugin

The first method is using the WordPress plugin. As a popular way to meet almost any kind of need for your WordPress site, there is also some plugin to remove or change the logo on your login page.

We pick Ultimate Dashboard for this time, as it has the feature to change or remove the logo on the WordPress login page. The plugin also allows you to customize the WordPress dashboard and create a custom dashboard if you need it.

The Ultimate Dashboard plugin is released as a freemium plugin, so, while all of the function we need in this tutorial is available for free, more advanced function like fully white label & rebrand the WordPress, advanced login customizer, and many more are available if you upgrade it to the Pro version. You can get the plugin from wordpress.org for free and for the pro version you can go to ultimatedashboard.io.

Once you’ve installed and activated the plugin let’s proceed to the next step.

Removing the Logo

To remove the WordPress logo from the login page, from your WordPress dashboard, go to Ultimate Dashboard then click on the Login Customizer setting. On the customizer page, open up the Logo setting then proceed to decrease the LOGO HEIGHT all the way to 0%.

You can immediately see the result on the preview window because we decreased the logo height to 0, the logo will disappear on your login page. Click the Publish button once you’ve finished.

Changing the Logo

To change the logo on your WordPress login page, the steps are similar to removing the logo which is by going to Ultimate Dashboard → Login Customizer → Logo settings. Once you have opened the setting, proceed to click on the LOGO → Select Image to select and upload the image for your new logo.

Once you’ve finished changing the logo, click on the Publish button to apply the changes you made.

Method 2: Using Custom Code

The second method is for you that prefer using a custom code to customize your WordPress site. Since we will be putting in the code to the functions.php file, you may want to backup your site and use a child theme to avoid breaking the parent theme or losing your changes when you update your theme.

Once you are ready, start by going to Appearance → Theme File Editor from your WordPress dashboard. In the Edit Theme page, continue by opening the functions.php file from the Theme Files list by clicking it.

Removing the Logo

To remove the logo from your WordPress login page, place the following custom code in your functions.php file under the PHP tag <?php and outside of an existing function.

/* Remove WP logo from login page */

function custom_login_logo() {
    echo '<style type ="text/css">.login h1 a { visibility:hidden!important; }</style>';
}

add_action('login_head', 'custom_login_logo');

What the code above does is prevent the header that has the logo from displaying itself by using visibility:hidden CSS to hide the element. Another CSS property that you can use to hide the element is display:none. However, unlike the previous property which can retain the space, display:none will entirely hide the element and its space so the login form may take the space and make it look aligned to the top.

Changing the Logo

To change the logo on your WordPress login page using custom code, you need to place the following code and change the sample image URL (https://example.com/your-logo.png) to your logo URL.

function my_custom_login_logo() {
    echo '<style type="text/css">
    h1 a {background-image:url(https://example.com/your-logo.png) !important; margin:0 auto;}
    </style>';
}
add_filter( 'login_head', 'my_custom_login_logo' );

By using the code above and changing the logo to our logo URL, you can see the result in the image below.