Replacing WordPress Logo on Login Page

First impressions count—and in WordPress, your login page is often the first touchpoint for clients, team members, or contributors. So why stick with the plain old WordPress logo when you can proudly display your brand? Replacing WordPress Logo on Login Page?

In this post, we’ll show you how to replace the default WordPress login logo with your own site logo—automatically using the logo set in your Customizer settings. No plugins needed, just a few lines of code.


Why Customize the Login Logo?

  • Brand Identity: Reinforce your brand presence.
  • Professionalism: Especially helpful on client or team-facing dashboards.
  • Consistency: Keep your site looking polished across every touchpoint.

The Smarter Way: Use Your Site’s Custom Logo

WordPress lets you set a custom site logo under Appearance > Customize > Site Identity. We’ll use that logo for the login screen—and if none is set, we’ll gracefully fall back to the classic WordPress logo.

How to Do It (Code Snippet)

Paste the following code into your theme’s functions.php file or in a custom plugin:

function custom_login_logo()
{
	$custom_logo_id = get_theme_mod('custom_logo');
	$logo_url = $custom_logo_id ? wp_get_attachment_image_url($custom_logo_id, 'full') : 'https://s.w.org/style/images/wp-header-logo.png'; ?>
	<style type="text/css">
		#login h1 a,
		.login h1 a {
			background-image: url('<?php echo esc_url($logo_url); ?>');
			height: 80px;
			width: 100%;
			background-size: contain;
			background-repeat: no-repeat;
			padding-bottom: 20px;
		}

		body.login {
			background-color: #3c434a;
		}

		body.login #backtoblog a,
		body.login #nav a {
			color: #fff;
		}

		body.login input#wp-submit {
			background: #3c434a;
			border: #3c434a;
			padding: 0px 30px;
		}

		body.login input#user_login,
		body.login input#user_pass {
			border-radius: 25px;
			padding: 0px 15px;
		}
	</style> <?php }
add_action('login_enqueue_scripts', 'custom_login_logo');
function custom_login_logo_url()
{
	return home_url();
}
add_filter('login_headerurl', 'custom_login_logo_url');
function custom_login_logo_title()
{
	return get_bloginfo('name');
}
add_filter('login_headertext', 'custom_login_logo_title');

Results

  • If your site logo is set in the Customizer, it will appear on the login page.
  • If not, it defaults back to the WordPress logo.
  • Clicking the logo takes users back to your homepage.
  • Hover text shows your site name.

Wrapping Up

Customizing your WordPress login page is a quick win that makes your site look more polished and professional. It’s easy, requires zero plugins, and shows visitors that you care about the details.

Have questions or want to go further with login page styling? Drop a comment or get in touch!

How to Remove Unused WooCommerce Images from Your WooCommerce Store

Implement The Code Theme’s function

Open your theme functions.php and paste the below code:

// Automatically Delete Woocommerce Images After Deleting a Product
add_action( 'before_delete_post', 'delete_product_images', 10, 1 );

function delete_product_images( $post_id )
{
    $product = wc_get_product( $post_id );

    if ( !$product ) {
        return;
    }

    $featured_image_id = $product->get_image_id();
    $image_galleries_id = $product->get_gallery_image_ids();

    if( !empty( $featured_image_id ) ) {
        wp_delete_post( $featured_image_id );
    }

    if( !empty( $image_galleries_id ) ) {
        foreach( $image_galleries_id as $single_image_id ) {
            wp_delete_post( $single_image_id );
        }
    }
}