Journal / Customise Your WordPress Login Page

★Monday, July 30th, 2007★Filed under Design, Wordpress★Tweet this

A few people have been talking lately about customizing their WordPress login page to reflect the look of the rest of their site. This is probably not very important as most sites don’t have any external users and therefore very few people will see the login page. But it sounded like a bit of fun and a nice distraction for 10 minutes, so I decided to give it a go. I first read about customising your WordPress login page at David Airey’s blog but I then found, at the last minute, a link to a plugin version. Although the customization is easy enough to do manually, their is a danger that upgrading WordPress could overwrite your changes. This plugin makes sure that this doesn’t happen. It also gives you an easy template to work from in .psd format, to make it simpler to do the customisation of the necessary image files. A couple of small things that it took me a couple of minutes to work out:

You need to overwrite the image named login-bkg-tile.jpg in the bm-custom-login/images directory with your new login image. Then upload the whole directory and activate.

To change the color of the ‘Username’, ‘Password’ and ‘Remember me’ text on the login panel, edit the file wp-admin/wp-admin.css. Search for the #Login instance and edit color: #fff; to whatever you want. Of course this could be overwritten when you upgrade WordPress.

Edit: To change the color of the ‘Username’, ‘Password’ and ‘Remember me’ text on the login panel, edit the file bm-custom-login.css within the plugin directory. Add the code color: #[hex code of your desired colour]; to the #login instance. This will also not be overwritten by future WordPress upgrades.

View my custom login page

8 responses so far

  1. Ben

    30th Jul, 2007 at 2:34 pm

    Hi Andy

    Thanks for linking me

    If you want to modify the colours you could also modify the css file in the plugin folder. This file is what I use to change the images on the login page so it will continue to work when you upgrade :)

  2. Nonimage

    30th Jul, 2007 at 3:12 pm

    Thanks Ben

    I should have realised that this was possible, and would have if I’d had a closer look at how the plugin worked. I have updated my post to reflect this.

  3. David Airey

    28th Aug, 2007 at 8:16 am

    Loving your own modification. Pretty swish.

    Thanks for the link too!

  4. Nonimage

    28th Aug, 2007 at 5:29 pm

    Thanks David. And thanks for the inspiration in the first place!

  5. jameswillisisthebest

    8th Sep, 2007 at 9:52 pm

    This is my first post
    just saying HI

  6. Mirko

    19th Feb, 2008 at 1:58 pm

    really interesting suggestions thx a lot

  7. Ideonstenny

    3rd Aug, 2008 at 4:57 am

    It’s amazing

  8. Maisha Gacke

    5th Jan, 2012 at 2:54 am

    Problem Loading

Leave a comment