I have long wanted to customize my WordPress login screen but I don’t know how to do it, or if it’s possible.
Few days ago, I stumbled upon graphic and logo designer David Airey’s post on Customize your WordPress login. It was the exact thing I intended to do. I was very thankful that I came across his very useful site.
I am administering my hometown’s website where I am using WordPress as CMS. And since the login screen is easily available to the contributors and members I thought that I would want to have a login screen that looks like the website, at least.
As we all know, this is the default WordPress login screen.
default WordPress login screen
So excited to practice what I’ve learned from David’s post, I immediately opened Adobe Photoshop. I edited the login-bkg-bottom.gif and login-bkg-tile.gif files which are located in wp-admin/images.
Sibale Online's previous login screen
This is the customized WordPress login screen for my hometown’s website. This is the first version.
Since I want to have a consistent look, I designed another login screen that looks similar to the theme.
Sibale Online's Current Login screen
Want to see it live? Take a peek at the customized WordPress login. It may already be different from the one pictured above, though.
Some may say that the login screen is just a small detail and that not everybody has access to it, but for the life of me, I want my login page to be something special.
My WordPress login screen
Check my current WordPress login screen live 🙂
But this customized WordPress login screen will be overwritten once you upgrade, hence, your login page will return to the default. I would prefer to manually overwrite the login files mentioned above after the upgrade, although time consuming. You may use the Plugin version if you want to. Here I have found two.
- BM Custom Login – Web Designer and Game Developer Ben Gillbanks of Binary Moon developed this plugin to give people an easy way to add a custom wordpress login screen. The plugin eases upgrading (in particular on client websites) and includes a login screen kit to speed up development of your own screens.
- Pimp My Login – Matt of SkyMinds.Net developed this WordPress plugin that allows you to easily edit the look and feel of the login page. It can display your own logo instead of the WordPress one and point to your blog’s URI instead of WordPress.org.
Was able to customize my WordPress login screen, and it was so easy, I had fun doing it. Will you customize your login screen too?
Apr 8, 2008 Update: WordPress 2.5 has a new WP Login screen. Here’s my new post on how to Customize the new WP 2.5 login screen.
Playing Around with Google Font API
Styling CommentLuv Last Blog Post for WordPress
QuickLogin Plugin For WordPress
Customize WordPress 2.5 Login Screen
wow thanks for sharing this. Im going to use it in one of my blogs. By the way amor, im creating a blog for my HS batch pero diko alam kung sanmakakaita ngresource about dun sa roles ng mga magreregister, maybe you can help me find a documentation about it kasinabasa ko ngayon na may blog ka pala na marami nagreregister.
sensya na at matagala ko di nakadalaw. nakipagbuno ako kay ka pepe ng dalawang linko. adjustmentperiod pa lang ako eh.
belated happy easter!
bluep’s last blog post…
If you were in my shoes, would you do the same to a USER-FRIENDLY?
thanks bluep for visiting.
Actually may problema pa ako sa WP regarding sa registration, kasi hindi nya nai-sesend sa member yung registration email na may password. Ewan ko nga ba bakit ganun, I can receive a new user registration notice, pero ang nagregister, wlang narereciv. Kaya ang ending, I have to send it manually pa.
Regarding sa roles ng mga mag reregister, lahat sila subscriber muna then kapag kilala ko at alam kong pwedeng maging contributor o editor, o di kya kapag nag volunteer sila, binabago ko yung roles.
Cge pag may nakita akong documentation about the roles, I’ll give you the link. 🙂
Amor’s last blog post…
Customized WordPress Login
Aba aba, Amor, this is really good info. I don’t like the login page kasi even if we have it self-hosted ay parang nakadikit palagi sa wp. Thru this info, we now have the chance to personalize the login page na parang part of site talaga. Thanks for this. I’ll surely play with it later
Marlene’s last blog post…
Technorati Authority Ka-Boom!
Amor,
Fren, thanks for the tip. Naku gusto ko rin to so I can make my login less boring. besides I love tweaking some parts of my blog especially backdoor parts dahil may konting programming (konti lang). hehehe!
jessie’s last blog post…
Cory Aquino Battles Colon Cancer
I have this on one of my blogs. I stumbled it, i think, last year. I wonder if it’s also compatible with the new WP.
Laarni’s last blog post…
Do opposites really attract?
Thanks Marlene and Jessie. I was so excited to personalize my login page after I read David’s post. I was just bloghopping and luckily I found his site, browsed his most popular posts and there I saw his post about customizing WP login. Pareho tayong tatlo na mahilig mangalikot ng themes, haha!
Thanks too Laarni, last year pa yong post, sana nga noon ko pa nabasa yun eh, haha…pasalamat talaga ako nakarating ako sa site na yun.
I just downloaded WordPress 2.5 for my local WordPress Install. And it has different WP login screen. I’m still searching for details on how can I customize the login screen.
There’s no login-bkg-bottom.gif and login-bkg-tile.gif files in the latest version, only logo-login.gif.
Amor’s last blog post…
Customized WordPress Login
hi, amor hope you can drop by sa blog ko pakinggan mo yun song sa new entry ko at hope you comment sa song good or bad. thank you
http://flipclan.com/unang-pagtingin
Gabriel’s last blog post…
No Frontal Nudity in Playboy Philippines
That mean all the stuff on WordPress are editable, you just need some courage and risk to play with it.
shanker bakshi’s last blog post…
WIN 5000 Entrecard Credits
thanks Gab for the invites, the song was nice.
You’re right Shanker, WordPress is editable, you just have to be adventurous. But I think, playing with WordPress’ files should be done offline, meaning with a local wordpress install. In that way, you wont mess up with your live blog when ‘changes’ doesn’t turn out right.
Pingback: Customizing WordPress 2.5 Login Screen | Amor's Personal Website