The default WordPress login page at /wp-login.php shows the WordPress logo above a plain white login form — instantly recognisable as a WordPress site and completely disconnected from the site’s design. A WordPress custom login page replaces this with branded, styled login that matches the site, improves the user experience for membership sites and client portals, and also provides a security benefit by obscuring the standard login URL from automated bots that target /wp-login.php directly. This fits into the wider topic we cover in our Complete Guide to WordPress How.
WordPress Custom Login Page — Plugin-Based Setup
The fastest path to a WordPress custom login page without writing code is a dedicated plugin. Custom Login Page Customizer (free) and LoginPress (free/premium) are the two most widely used options — both provide a visual customiser for the login page with no code required.
Install Custom Login Page Customizer → navigate to Appearance → Customize → Login Page — the live Customizer opens with the login page visible in the preview pane. Configure: Logo (upload the site’s logo to replace the WordPress logo), Background (colour, image, or gradient), Form (background colour, border radius, padding), Button (colour, hover state, border radius), and Typography (font family, size, colour for all text elements). Every change previews in real time. When satisfied, click Publish — the login page at /wp-login.php immediately reflects all changes. The plugin outputs CSS overrides for the login page and replaces the WordPress logo link with the site’s home URL, making the logo clickable back to the site rather than to wordpress.org.
LoginPress extends the WordPress custom login page with a more comprehensive Customizer panel including pre-built themes (a library of complete login page designs that can be applied in one click), background video support, animated backgrounds, and a custom HTML field for adding any additional elements. The free version covers most needs; the premium version adds Google Fonts, multi-site support, and additional pre-built themes. Both plugins are compatible with all major security plugins and do not conflict with login redirect plugins or two-factor authentication plugins that also modify the login flow. According to the WordPress developer documentation, the login page accepts custom CSS through the login_enqueue_scripts hook and template modifications through a combination of login hooks — the same hooks these plugins use internally.
Custom Login Page With Code
For developers wanting precise control, creating a WordPress custom login page with code uses WordPress hooks without an additional plugin, WordPress provides a set of hooks specifically for login page customisation. These hooks cover the logo, CSS, header URL, and error messages.
Replace the WordPress logo for a branded WordPress custom login page: and update the logo link:
// Replace logo
add_filter('login_headerurl', fn() => home_url());
add_filter('login_headertext', fn() => get_bloginfo('name'));
add_action('login_enqueue_scripts', function() {
$logo = get_theme_mod('custom_logo');
$logo_url = $logo ? wp_get_attachment_image_url($logo, 'full') : get_stylesheet_directory_uri() . '/images/logo.png';
echo '<style>
#login h1 a {
background-image: url(' . esc_url($logo_url) . ');
background-size: contain;
width: 200px;
height: 80px;
}
</style>';
});Add full custom CSS for the WordPress custom login page through the same login_enqueue_scripts hook — enqueue a stylesheet from the child theme or output inline CSS. Style the body background, the login form container (#login or #loginform), the submit button (#wp-submit), and the error messages (.login-message). The login page has its own CSS isolation from the front-end — front-end stylesheets do not apply here, and all styling must be added through the login-specific hooks. For consistent branding, import the same CSS variables and base typography from the front-end stylesheet into the login page CSS to maintain visual consistency without duplicating all CSS. Our guide on adding custom CSS to WordPress covers the CSS variable approach that makes maintaining consistent typography and colour across the login page and front-end straightforward.
Custom Login URL — Hiding wp-login.php
The default WordPress login URL at /wp-login.php is known to every automated bot that targets WordPress sites. A WordPress custom login page at a non-standard URL stops bots that target /wp-login.php receive a 404 instead of a login form, eliminating the brute force attack surface entirely. A WordPress custom login page at a non-standard URL is invisible to automated scanning tools that do not already know the site’s specific login path.
WPS Hide Login changes the login URL — the most popular WordPress custom login page security plugin with a single setting: install → Settings → WPS Hide Login → enter a custom login URL slug (e.g., “member-access” → the login page is now at /member-access/) → Save. Accessing /wp-login.php returns a 404. The admin area remains at /wp-admin/ but redirects to the custom login URL when not authenticated. Note the custom URL and do not forget it — if the plugin is deactivated, the original /wp-login.php is immediately restored, but while the plugin is active, forgetting the custom URL locks you out. Store the custom login URL in a password manager and document it for all team members.
Security considerations for a custom login URL: the URL should be non-obvious — avoid common alternatives like “login,” “signin,” “admin-login,” or “user-login” that bots also try. A memorable but non-guessable path like “team-access-[random-word]” is more secure. The custom URL should also be excluded from caching: add it to the caching plugin’s “Never Cache These Pages” list alongside the normal /wp-admin/ and /wp-login.php/ exclusions. A cached version of the login page causes authentication failures because the nonce in the cached form has expired by the time the cached page is served. Our guide on preventing WordPress spam and security attacks covers the complementary security measures — two-factor authentication, login attempt limiting, and IP blocking — that work alongside a custom login URL for comprehensive login security.
Custom Login Redirects and Multi-Role Login
After login, WordPress redirects all users to the admin dashboard by default. A WordPress custom login page setup for a membership site, a client portal, or a WooCommerce store should redirect users to a front-end page appropriate to their role — subscribers to their account page, shop managers to the WooCommerce orders dashboard, editors to the post list.
Configure redirects after the WordPress custom login page using the login_redirect filter: add_filter('login_redirect', function($redirect_to, $requested_redirect, $user) { if (in_array('subscriber', (array)$user->roles)) { return home_url('/my-account/'); } if (in_array('shop_manager', (array)$user->roles)) { return admin_url('edit.php?post_type=shop_order'); } return $redirect_to; }, 10, 3);. This redirects subscribers to the account page and shop managers to the orders screen while leaving all other roles on the default redirect (the dashboard). Add cases for each role that needs a custom redirect destination. The same filter handles post-login redirect for both the native login page and a WordPress custom login page plugin — the filter fires after authentication regardless of which login form was used.
WooCommerce sites with a custom login shortcode on a page ([woocommerce_my_account]) or a custom login page created with a page builder can redirect WooCommerce logins separately from the WordPress admin login using WooCommerce’s own redirect settings: WooCommerce → Settings → Accounts & Privacy → configures the “My account” page that WooCommerce redirects to after its own login flow. Ensure this setting points to the correct account page and that the account page is not accidentally excluded from the caching plugin’s cache — a cached account page shows the previous visitor’s account data, which is a serious data privacy issue. All pages that require authentication (account, checkout, order history) must be in the “Never Cache” list of the caching plugin. Reviews from the WordPress developer community confirm that WPS Hide Login combined with a custom login URL and role-based redirects represents the most widely-implemented custom login configuration across WordPress membership and ecommerce sites.
Login Page on Multisite and With Page Builders
A WordPress custom login page on WordPress Multisite affects all subsites simultaneously — the login page customisation applies network-wide because all subsites share the same /wp-login.php file. Network-level login page customisation through a network-activated plugin covers all subsites without per-subsite configuration.
For subsites that need distinct WordPress custom login page branding, implement per-subsite detection using $_SERVER['HTTP_HOST'] to identify the current subsite’s domain and apply site-specific logo and CSS based on the subdomain or path. Plugin options stored in the network’s site options can provide per-subsite login page configurations that a single network-activated plugin reads and applies. This approach is used by large multisite networks (university sites, franchise networks, media groups) where each subsite maintains distinct visual branding that extends to the login experience.
A fully designed WordPress custom login page using a page builder (Elementor, Divi) on a regular WordPress page — rather than customising the native /wp-login.php — provides the most design flexibility. The process: create a standard WordPress page with the desired login form design using the page builder → add a login form widget (Elementor Pro includes a Login widget; Elementor free requires a forms plugin) → publish the page at a clean URL (e.g., /login/) → configure WPS Hide Login to use the same URL as the custom page, or disable the plugin and use the page as a standalone login destination. The WordPress custom login page page builder approach allows any visual design — the form can be placed in a full-bleed hero section with a background image, alongside testimonials, in a split-screen layout, or in any other arrangement the page builder supports. For sites where the login experience is a significant brand touchpoint — membership sites, online courses, client portals — a full page builder design login page creates a first impression that the standard WordPress login form cannot match. Our guide on managing WordPress user roles covers the role configuration that pairs with custom login redirects to direct each user type to the correct destination after authentication through the custom login page.
Two-factor authentication (2FA) integrates with any WordPress custom login page without visual conflicts — 2FA plugins add their own step after the standard login form submits, either showing a second form for the OTP code or redirecting to a 2FA verification page. WP 2FA, Wordfence 2FA, and Google Authenticator plugins all work correctly alongside login URL customisation and login page styling plugins. After the user completes the first login form (username and password), the 2FA plugin intercepts the authentication flow and shows its own OTP entry form before granting access. Style the 2FA form by targeting its CSS classes in the login page custom CSS to match the overall branded login experience, ensuring the full authentication flow is visually consistent from the initial login page through the OTP verification step.
Testing a WordPress custom login page thoroughly before going live covers several scenarios that are easy to overlook: login with incorrect credentials (confirm error messages display correctly and are styled consistently), login with a correct password that has 2FA enabled (confirm the 2FA step triggers), logout and confirm the site redirects to the custom login page rather than the default wp-login.php, test the “Lost your password?” link (ensure the password reset email links back to the custom login URL rather than the default), and test login on mobile (the login form should be responsive and usable on small screens). These tests confirm that the custom login page handles all authentication states correctly and that no authentication flow bypasses the branded experience to fall back to the generic WordPress login form unexpectedly.
GDPR and privacy considerations for the WordPress custom login page include displaying a privacy policy notice for sites that require users to agree to data processing terms before logging in. Add a privacy policy link below the login form by hooking into the login_footer action: add_action('login_footer', function() { echo '<div class="privacy-notice">By logging in, you agree to our <a href="' . get_privacy_policy_url() . '">Privacy Policy</a>.</div>'; });. WordPress’s get_privacy_policy_url() returns the URL of the designated Privacy Policy page set in Settings → Privacy. Adding this disclosure to the login page satisfies transparency requirements for sites where login implies consent to data processing, and the consistent URL management through WordPress’s privacy page system means it updates automatically if the privacy policy URL ever changes.
Limiting login attempts on a WordPress custom login page prevents brute force attacks even when the login URL is customised — a determined attacker who discovers the custom URL will still attempt credential stuffing unless the site limits repeated failed attempts. Limit Login Attempts Reloaded (free, 2+ million active installations) adds automatic IP-based lockouts after a configurable number of failed attempts, with increasing lockout durations for repeat offenders. Configure: Settings → Limit Login Attempts → set “Allowed retries” to 5, “Minutes lockout” to 30, “Hours until retries are reset” to 24. After this many failed attempts from a single IP, the login form shows a lockout message and blocks further attempts for the configured duration. Combine with the custom login URL from WPS Hide Login for the most robust login security posture: bots that find the custom URL are rate-limited before they can exhaust the password space, and bots that do not find it never encounter the login form at all.
