Every WordPress site ships with the same login page: the WordPress logo, a gray background, and a blue button that has nothing to do with your brand. You do not need a plugin to change any of it, because a few small snippets replace the logo, restyle the form, and clean up the details most people never touch.
I will walk you through the exact code I use to customize the WordPress login page manually, piece by piece. You will know what each line does instead of pasting one mystery blob and hoping.
Key Takeaways
- Almost everything hangs off one hook,
login_enqueue_scripts, which prints your CSS on wp-login.php and nowhere else. - Your logo replaces the WordPress one with a small CSS block, and two filters (
login_headerurlandlogin_headertext) point the logo link at your site instead of wordpress.org. - Put the snippets in a child theme’s functions.php or a code-snippets plugin, and test from a second browser so a typo cannot lock you out.
- The browser tab says “WordPress” by default; the
login_titlefilter removes it, which is the finishing touch most tutorials skip. - Plugins like LoginPress do the same job from a panel; the code route simply gives you the same result with nothing new to update.
Why customize the WordPress login page at all
On a solo blog where you are the only person logging in, the default page is honestly fine, and I would not spend an afternoon on it. The moment other people see that screen, though, it starts doing brand work: client dashboards, membership sites, WooCommerce stores with customer accounts, and multi-author blogs all put the login page in front of users who are not you.
A login page with your logo and colors reads as a finished product, while the default reads as a template someone never got around to. That is a small trust signal, but trust signals stack, and this one costs you about fifteen minutes.
Where the login page code goes (and where it should not)
Every snippet below goes into your child theme’s functions.php, or into a code-snippets plugin if you want a safety net that disables a broken snippet instead of white-screening the site. It is the same home I use for other small tweaks, like adding a duplicate-post link without a plugin. Never put them in the parent theme, because the next theme update silently wipes your work.
One warning from experience: test while you stay logged in from a second browser or a private window. The login page is the one place where a stray syntax error can genuinely lock you out, and if that ever happens you can still reset your password from the file manager.
Replace the WordPress logo with your own
The logo is just a CSS background image on the #login h1 a element, so replacing it takes one style block. WordPress gives us the login_enqueue_scripts hook, which prints whatever you hang on it into the head of the login page only, so none of this CSS loads anywhere else on your site.
function wpc_login_logo() { ?>
<style>
#login h1 a {
background-image: url('<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/images/login-logo.png');
background-size: contain;
background-position: center;
width: 240px;
height: 84px;
}
</style>
<?php }
add_action( 'login_enqueue_scripts', 'wpc_login_logo' );Upload your logo to an images folder inside your child theme, or paste a full media-library URL instead, then set the width and height to roughly match its proportions. background-size: contain keeps the logo sharp inside whatever box you choose, so you are not fighting cropping.
Point the login logo at your site, not WordPress.org
By default the logo links to wordpress.org and the accessible hover text says “Powered by WordPress”, which is a strange look on a branded client login. Two small filters fix both:
add_filter( 'login_headerurl', function () {
return home_url();
} );
add_filter( 'login_headertext', function () {
return get_bloginfo( 'name' );
} );The first filter, login_headerurl, swaps the link target for your own homepage, and the second replaces the text with your site name. They are one-liners, but they are the difference between a white-labeled page and one that still points people at somebody else’s website.
Style the login background, form, and button
With the logo sorted, the rest is plain CSS pasted into the same style block from the first snippet. These selectors cover the pieces people actually want to change: the page background, the form card, the button, and the links under the form.
body.login {
background-color: #f6f5ff;
}
.login form {
border-radius: 10px;
border: 1px solid #e4e0f5;
box-shadow: 0 8px 24px rgba(103, 61, 229, 0.08);
}
.wp-core-ui .button-primary {
background: #673de5;
border-color: #673de5;
}
.login #backtoblog a,
.login #nav a {
color: #4c4670;
}Swap the colors for your own palette and you are done. .wp-core-ui .button-primary is the log-in button itself, and the last block styles the “Lost your password?” and “Back to site” links; keep the button contrast strong, because this is a form people use half-awake at 7 am.
Bonus: remove “WordPress” from the login tab title
Open your login page and look at the browser tab: on a default install the title ends with “WordPress”. The login_title filter controls that whole string, so you can rebuild it around your own site name instead:
add_filter( 'login_title', function ( $login_title, $title ) {
return $title . ' | ' . get_bloginfo( 'name' );
}, 10, 2 );
The filter receives the full title plus the page-specific part ($title, usually “Log In”), so returning your own combination drops the trailing “WordPress” cleanly. It is a two-minute change, and it is exactly the detail a client notices without being able to say why the page suddenly feels finished.
| What you are changing | Hook or filter | How it works |
|---|---|---|
| Logo image | login_enqueue_scripts | CSS background image on #login h1 a |
| Logo link and hover text | login_headerurl, login_headertext | Two one-line PHP filters |
| Background, form, and button styling | login_enqueue_scripts | Plain CSS in the same style block |
| Browser tab title | login_title | PHP filter rebuilding the title string |
One thing this styling does not do is make the login page more secure; the URL is still wp-login.php and bots still find it every day. If that is your next itch, I cover two safe approaches in changing the wp-admin URL without a plugin.
So, should you customize the login page by hand or with a plugin?
Hand-coding wins for me here, and not because plugins like LoginPress do a bad job; they are genuinely convenient, with live previews and ready-made templates. The login page is just a set-and-forget change, and carrying a whole plugin with its updates and upsell screens to hold four small snippets is more maintenance than the job deserves.
If you are not comfortable in functions.php, use the plugin without guilt, because a branded login page beats a default one either way. But if you can paste code, the manual route gives you the same result with nothing new to update, and you now understand every line of it.
Stuck customizing your login page?
If a snippet is not behaving or you want the login page matched to your brand properly, feel free to contact us or email me and I will point you in the right direction.
Update Logs
02 Jul 2026
- Rewrote the guide around cleaner snippets with plain explanations of each hook and filter, added the logo-link fix and the browser-tab cleanup, and refreshed the styling examples.
Want our posts to show up more often on Google?
One step & Google will surface this site in your Top Stories.
