How to Change the WordPress Login Logo Image

Replace the default WordPress logo on your login page with your own custom branding using this simple code snippet.

function custom_login_logo() {
	$logo_url = esc_url( wp_upload_dir()['baseurl'] . '/my-logo.svg');
	$css = "#login h1 a {
        background: url('{$logo_url}') no-repeat center / contain;
        width:auto;
        max-width: 320px;
        height: 80px;
    }";

	wp_add_inline_style( 'login', $css );
}

add_action( 'login_enqueue_scripts', 'custom_login_logo');

Quick Steps to Change the WordPress Login Logo Image

Follow these simple steps to change your WordPress login logo:

1. Upload your logo to your WordPress media library or upload it via FTP to your uploads folder.
2. Install and activate the WPCodeBox plugin, then navigate to WPCodeBox 2 in your WordPress dashboard.
3. Copy the code snippet above and paste it into the WPCodeBox code editor.
4. Update the logo path in the code to point to your actual logo file URL.
5. Give your snippet a descriptive title (like “Custom Login Logo”), select PHP as the type, then click Save.
6. Enable the snippet by toggling the switch to the active position.
7. Test the changes by visiting yourdomain.com/wp-admin to see your new logo.

That’s it! Your custom login logo is now active on your WordPress site.

Change the WordPress Login Logo Image – Additional Information

Why Customize Your WordPress Login Logo

Changing the WordPress login logo might seem like a small detail, but it has significant benefits for your brand and professional appearance. When clients, team members, or users log into your WordPress site, the login page is often their first interaction with your backend experience. Replacing the default WordPress logo with your own creates an on-brand experience.

For agencies and developers, customizing the login logo establishes ownership and professionalism. It shows attention to detail and transforms a generic WordPress installation into a custom-built solution. 

Important Considerations When Changing the WordPress Login Logo

When customizing your login logo, consider the following best practices:

• Logo sizing and format matter. Your logo should be optimized for the login page dimensions. SVG files work well because they scale perfectly across different screen sizes and devices. PNG files are also good options, especially if you need transparency.
• Responsive design ensures your logo looks good on all devices. The CSS in the snippet uses background-size: contain to maintain proper aspect ratios across different screen sizes.
• Accessibility considerations include maintaining good contrast ratios and ensuring your logo is clear and readable. The login page should remain functional and accessible to all users.