Tutorial – changing the look of the registration page

I wrote this tutorial to explain how to change what wp-login.php looks like. Hope it goes without saying, but users should back up their files before mucking about in them! This tutorial requires only confidence in editing code and using FTP, it does not require knowledge of HTML, CSS, or php.

Tested in WordPress 2.0.4 only.

Enjoy.

1. create a new graphic to replace the wordpress logo; it will fit best if the new graphic is no more than 250px wide and around 40px tall; can be in any format you like.

2. Upload this graphic to wp-admin/images (or wherever you like, but if you put it somewhere else on your server you’ll need to adjust the URL in step 3 below).

3. open wp-admin/wp-admin.css in your text editor of choice, and change the settings for the style #login h1 (at or around line 536). Where it has the URL, you should change wordpress-logo.png to the filename of your logo.

4. Close the CSS file and upload it to the server to replace the old copy.

5. Go to your wp root file and download wp-login.php.

6. At or around line 227, you’ll see a line with an h1 header, and a link to wordpress, and the text “Wordpress”. Change the link to the URL of your website, and the text “Wordpress” to whatever you’d like it to say; probably the name of your website (not very important, because this text will not show up visibly on your page, but it will be seen and used by search engine bots and by users who surf the web with text readers like JAWS).

7. You can change other text on this page if you like; I’ve changed “Back to blog” on or about line 245, to “Back to the website”, but otherwise left the page alone.

8. You’re now done with editing wp-login.php. Close it and upload it back to overwrite the version on the server.

9. Follow the instructions for changing the h1 line and the text on the page, for wp-register.php, in the wp root folder, as well.

That’s it! You can just test it by trying to log in to your site, hit the refresh button on your browser if it doesn’t look right.

I did not change colors or other stuff on the login page, but now that you know where the CSS and the pagefile are, you can tackle this yourself too.