3 Hooks To Improve Your WordPress Login Page

The WordPress login page is often neglected, but we can tweak it a bit to add a bit more branding. Add the following to your functions.php (or custom_functions.php if you use the Thesis theme).

/**
 * Change the logo on the login page. Make the image no wider than 320px and no taller than 82px.
 */
function custom_login_logo() {
  ?>
	h1 a { background: url(/custom/images/logo_login.png) 50% 50% no-repeat !important; }
	<?php
}
add_action('login_head', 'custom_login_logo');

/**
 * Change where the logo on the login page links to
 */
function custom_login_headerurl($url) {
  return bloginfo('url') . '/';
}
add_filter('login_headerurl', 'custom_login_headerurl');

/**
 * Change the title attribute for the logo link on the login page
 */
function custom_login_headertitle($title) {
  return bloginfo('name');
}
add_filter('login_headertitle', 'custom_login_headertitle');

Fairly simply action hook and filters.

  1. We add in an internal style sheet for one line of CSS to change the background image.
  2. The first filter to return, in this case, the main URL for the site (you could link this anywhere – perhaps to the developer site if this is a client site).
  3. Finally a second filter for the title attribute, and here it’s just the name of the site.

Full Styling

If you linked to an external style sheet instead of an internal one as above, then added a few more styles, then you could style the whole page as you wish. I’ll leave this as an exercise for the reader to complete ;-)

Login Screenshot Advanced

Comments

  1. Thanks. It’s worked. Im looking for this one and done search many times but this one is great.

Speak Your Mind

*