Bits of .NET

🎨 Professional Login Page for Clients

Default WordPress login looks generic. Custom login page shows your brand. Logo, colors, background — professional impression.

📝 Custom Login CSS

// functions.php
function custom_login_logo() {
    echo '<style>
        body.login {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }
        .login h1 a {
            background-image: url(' . get_stylesheet_directory_uri() . '/images/logo.png);
            background-size: contain;
            width: 200px;
            height: 80px;
        }
        .login form {
            background: rgba(255,255,255,0.95);
            border-radius: 16px;
            box-shadow: 0 15px 35px rgba(0,0,0,0.2);
            padding: 30px;
        }
        .wp-core-ui .button-primary {
            background: #667eea;
            border-color: #667eea;
        }
        .wp-core-ui .button-primary:hover {
            background: #764ba2;
            border-color: #764ba2;
        }
        .login #nav a,
        .login #backtoblog a {
            color: white !important;
        }
    </style>';
}
add_action('login_enqueue_scripts', 'custom_login_logo');

function custom_login_logo_url() {
    return home_url();
}
add_filter('login_headerurl', 'custom_login_logo_url');

🎯 Custom Login Message

function custom_login_message() {
    return '<p style="text-align:center; color:#fff; margin-top:20px; font-size:14px;">Welcome to Client Portal</p>';
}
add_filter('login_message', 'custom_login_message');

// Remove WordPress version from login
function remove_version_from_login() {
    remove_action('login_head', 'wp_shake_js', 12);
}
add_action('login_head', 'remove_version_from_login');

💡 Pro Tips

• Use client logo for branded experience
• Match colors to client brand
• Add client name to login page
• Remove WordPress branding for white-label