The WordPress login page greets every administrator, editor, and client with a large WordPress logo that links to wordpress.org. For agency-delivered sites and plugin developers handing off client sites, this is a branding miss, the login page is the first thing a client sees when they access their site’s backend, and it should reflect their brand or yours, not WordPress’s. This snippet covers the three standard white-label customisations: logo, link destination, and basic colour theming.
The Code
Add this to your functions.php or a site-specific plugin. Place your logo file at /images/logo.svg in your theme directory, or adjust the path to wherever your logo lives.
The Logo
The login page logo is an <h1><a> element with the WordPress logo set as a CSS background image. The snippet overrides that background image with your own logo via the login_enqueue_scripts action, which fires on the login page before styles are output. SVG is the recommended format, it scales cleanly at any size and the file is typically small.
The height of the logo container is set to 80px in the snippet. Adjust this based on your logo’s aspect ratio, taller logos need more height, horizontal logos may need less. The background-size: contain and background-position: center combination scales the logo to fit within whatever dimensions you set without cropping.
login_headerurl
By default, clicking the logo on the login page opens wordpress.org in a new context. The login_headerurl filter changes the link destination to your homepage. Clients who click the logo will be taken to the front end of their own site, which is almost certainly what they’d expect, rather than to an external WordPress marketing page.
login_headertext
The tooltip text shown when hovering the logo link defaults to “Powered by WordPress”. The login_headertext filter replaces it with the site name from WordPress settings. This is a minor detail but it completes the white-labeling, no WordPress branding remains visible on the login page after these three changes.
Colour Customisation
The inline styles in the snippet target the login form’s input fields and primary button. The focus ring colour and button colour are set to a purple that matches the Nahnu Plugins brand, replace #7c3aed and #6d28d9 with your own brand colours. Keep the button hover state slightly darker than the default state to maintain visual feedback.
Going Further
For a fully custom login page, custom background, custom layout, or a completely redesigned form, consider using the login page customisation as a starting point and adding more CSS to hide the WordPress footer text (#login_error, .privacy-policy-page-link) or the “Back to site” link. The login_footer action also allows injecting custom HTML at the bottom of the login form for things like support contact information.
// Replace the login logo with your own
add_action( 'login_enqueue_scripts', function() {
$logo_url = get_stylesheet_directory_uri() . '/images/logo.svg';
?>
<style>
#login h1 a {
background-image: url('<?php echo esc_url( $logo_url ); ?>');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
width: 100%;
height: 80px;
display: block;
}
/* Match your brand colours */
.login input[type="text"],
.login input[type="password"] {
border-radius: 8px;
border-color: #e2e8f0;
}
.login input[type="text"]:focus,
.login input[type="password"]:focus {
border-color: #7c3aed;
box-shadow: 0 0 0 1px #7c3aed;
}
.wp-core-ui .button-primary {
background: #7c3aed;
border-color: #6d28d9;
box-shadow: none;
}
.wp-core-ui .button-primary:hover {
background: #6d28d9;
border-color: #5b21b6;
}
</style>
<?php
} );
// Point the logo link to your homepage instead of wordpress.org
add_filter( 'login_headerurl', function() {
return home_url( '/' );
} );
// Change the logo tooltip text
add_filter( 'login_headertext', function() {
return get_bloginfo( 'name' );
} );