How to Brand Your WordPress Login Page

You are not stuck with the simple (and boring) WordPress login page.  Branding your WordPress login page is relatively easy and allows you to provide a more customized experience for the users of your website. These steps will eliminate the use and a plugin for changing the login image.

Step 1: Add to functions.php file

//////////////////////
// Replace WP Login //
//////////////////////
// Calling your own login css so you can style it
function paperstreet_login_css()
{
    wp_enqueue_style(‘paperstreet_login_css’, get_template_directory_uri() . ‘/css/login.css’, false);
}

// changing the logo link from wordpress.org to your site
function paperstreet_login_url()
{
    return home_url();
}

// changing the alt text on the logo to show your site name
function paperstreet_login_title()
{
    return get_option(‘blogname’);
}

// calling it only on the login page
add_action(‘login_enqueue_scripts’, ‘paperstreet_login_css’, 10);
add_filter(‘login_headerurl’, ‘paperstreet_login_url’);
add_filter(‘login_headertitle’, ‘paperstreet_login_title’);

Step 2: Create and Add Image to login.css

.login h1 a {
background: url(/images/layout/logo.png) no-repeat top center;
width: 326px;
height: 73px;
text-indent: -9999px;
overflow: hidden;
padding-bottom: 15px;
display: block; }

The final product looks like the image below.