Custom Wordpress Login Page – Tutorial, Plugin & Free Backgrounds

If you have subscribed to WPExplorer you have probably noticed that the login panel is not the same as the default Wordpress login. In fact it looks like just like the picture above. And you can see it at the link below:

WPExplorer Custom Login Page

Creating a custom Wordpress login page is not only fun but I think it is important to show your members and visitors that your site is legit and it cares about improving the small things as well.

One way to go about creating the Custom Wordpress login/register page is by altering the default Wordpress stylesheet and code, however, the problem is that when you upgrade your version of Wordpress all your settings will disappear and you will have to style everything over again.

Lucky for you and me, there is a plugin called BM Custom Login Plugin, created by Binary Moon.

This plugin will allow you to create a custom Wordpress login panel and it will update itself simply by activating the plugin. Plus, the plugin comes with some really nice templates to get you started.

Key Features

Includes PSD template
Automatically updates the login/register Wordpress Page
Uses php and css to change default settings
Keeps your settings even after Wordpress upgrades

Setup & Installation

Dowload the plugin (below)
Open the plugin folder and browser to the image-templates folder
Open the login-bkg-tile.psd file
Edit to your liking
Save as a jpeg file titled “login-bkg-tile.jpg”
Upload the gif file to your plugin/images folder
Activate the plugin and enjoy

Download The Plugin

Download the BM Custom Login Plugin from Wordpress.org here.

Free backgrounds by WPExplorer

The following Backgrounds are to be used with the BM Custom Login Plugin and they can all be download in a zip file below, but first i want to show them to you.

Blue:

Red/Orange:

Green:

How To Use The Backgrounds

Download & Extract
Open the “bm-custom-login-3.css’ file in your plugin folder with a text-editor
Change the background file from “login-bkg-tile.jpeg” to “login-bkg-tile.gif” (these are gifs to conserve transparency, the plugin uses jpegs)
Drag the background you wish to use into the images folder