Gaining Control of your Blog’s Login: Hacking the WordPress wp-login for a Custom Login Page
This post was originally published at LionVineyard.com on 2009/03/22
It does not feel really yours unless you take complete control of it. And this is exactly the case of a blog. The front end might look yours, but going one step behind the scenes and it only resembles to be yours. By one step behind I mean the login page. Yes, there are WordPress plugins out there that will customize your login experience. But do they do what you really want? The didn’t for me. In this article I will help you gain control of your blog’s login page. Together we will hack the WordPress wp-login.php file and create a custom login page to match your theme.
Before we continue: This methodology will require you to backup the wp-login.php everytime before you upgrade to a newer version of WordPress. Failure to do so, will result in you going back and doing it all over again. Also in the event the WordPress developers make changes in the wp-login.php you will have to account for those as well. If you are not up for these task then a plugin is the way to go. If you are up for the challenge, let’s play!
The first thing you need is to understand your theme. Usually a WordPress theme is divided into subfiles, like header.php, footer.php, page.php, 404.php etc… And this we will need. If your theme is not in this format then there is more play for you.
Once you identify these files, it is time to locate one file that handles the rendering of a simple page. For example page.php or 404.php. I would prefer 404.php as it is a cleaner file, does not have loops inside it as the page.php. Edit that file and understand the div tags. There opening and closing and where the content of the page appears. For example my 404.php looks something like this:
<div class="level1"> <div class="level2"> <!-- YOUR PAGE CONTENT HERE --></div> </div>
The next step is to locate the wp-login.php in the root directory of your domain. Copy it and rename it before making any changes. So you will have a backup in case things do not go as planned.
The first thing is to locate lines 47-59 and delete them. Note: This is valid for WordPress 2.7.1. I do not know if this lines are the same in earlier versions. Once you have deleted them you will need to insert in their place the opening of your 404.php page (or whatever page you chose as your guide). For example from my example above:
<div class="level1"></div>
With this completed, the next task is to locate the body and html closing tags
These appear three times in the wp-login.php at the end of the case conditional statements. So once you locate them you will have to delete them and replace them with the closing of your 404.php page (or whatever page you chose as your guide). For example from my example above:
Save your wp-login.php upload to your root directory and that’s it. The play is over!
Also you can omit the sidebars if you like. You will just have to figure out how they are incorporated into your theme and disable them for the login page. In the Playgroud’s theme the sidebars are loaded in the footer.php so I decided to keep them for the log in page.
And now you have gained control of your blog, on step behind the scenes. This will have taken care of all three, the log in page, the new user registration, and the forgot password pages.