tifosi

This plugin allows the user to completely customise the look and feel of the WordPress login page from the comfort of the WordPress admin customizer interface.
<ul>
<li>Dynamically creates a custom login css file to override default values</li>
<li>Fully integrated with WordPress Customiser</li>
<li>Intuitive interface with sections & settings</li>
<li>Filters to override defaults via your parent/child theme</li>
</ul>
<h3>Usage</h3>
<ol>
<li>Go to Appearance > Customise</li>
<li>Select the Login Customiser Menu Panel</li>
<li>Select from the available sections and change the settings as required. Once changed the save & publish button will be available. Select this to save changes. These will be available to the login screen when next logging in, or as below.</li>
</ol>
The plugin dynamically creates a new login css file for the login page only which contains css settings that override the default styling.
The login panel of course is only available to non logged-in users, so testing the changes can be done via logging out / in, or better via using a separate computer, or via testing with a different browser e.g. logged in via IE, not logged in on chrome.
<h3>Filters</h3>
The default values displayed in the Admin UI customiser can be modified via a selection of filters.
Panel: 
loginizr_panel – Panel name, default: lognizr_panel 
add_filter ( ‘loginizr_panel’, set_loginizr_panel, 10, 1); 
function set_loginizr_panel ( $default ) { 
 return ‘loginizr’; 
}
loginizr_priority – Panel priority, default: 30 
add_filter ( ‘loginizr_priority’, set_loginizr_priority, 10, 1); 
function set_loginizr_priority ( $default ) { 
 return 40; // put lower down order 
}
loginizr_title – Panel title, default: Login Customizer 
add_filter( ‘loginizr_title’,set_loginizr_title, 10, 1); 
function set_loginizr_title ( $title ) { 
 return __( ‘Loginizr’, ‘wordpress’ ); 
}
loginizr_description – Panel description, default: Customize the generic WordPress login page 
add_filter( ‘loginizr_description’, set_loginizr_description, 10, 1); 
function set_loginizr_title ( $desc ) { 
 return __( ‘Customize your WordPress Login Page’, ‘wordpress’ ); 
}
Section: Each section has a filter for priority & title
add_filter( ‘loginizr_section_priority’, ‘set_loginizr_section_priority’, 10, 2 ); 
function set_loginizr_section_priority( $priority, $section = ” ) {
<pre><code>// basic check, can also add check against set section names
if ( empty( $section ) ) { return $priority; } 

//check section name
switch( $section ) {
 case 'background':
 return 5;
 case 'logo':
 return 10;
 case 'form_bg':
 return 15;
 case 'form':
 return 20;
 case 'field':
 return 25;
 case 'button':
 return 30;
 case 'other':
 return 35;
 default:
 return $priority;
} 
</code></pre>
}
add_filter( ‘loginizr_section_title’, ‘set_loginizr_section_title’, 10, 2 ); 
function set_loginizr_section_title( $title, $section = ” ) {
<pre><code>// basic check, can also add check against set section names
if ( empty( $section ) ) { return $title; } 

//check section name
switch( $section ) {
 case 'background':
 return __( 'Background', 'txt' );
 case 'logo':
 return __( 'Logo', 'txt' );
 case 'form_bg':
 return __( 'Form Background', 'txt' );
 case 'form':
 return __( 'Form', 'txt' );
 case 'field':
 return __( 'Field', 'txt' );
 case 'button':
 return __( 'Button', 'txt' );
 case 'other':
 return __( 'Other', 'txt' );
 default:
 return $title;
} 
</code></pre>
}
Settings: Some settings with default values also have available filters
add_filter ( ‘loginizr_bg_color’, set_loginizr_bg_color, 10, 1); 
function set_loginizr_priority ( $default ) { 
 return ‘#fff’; // valid hex or rbg value, default #f1f1f1 
}
add_filter ( ‘loginizr_logo_width’, set_loginizr_logo_width, 10, 1); 
function set_loginizr_logo_width ( $default ) { 
 return ‘100px’; //default 125px 
}
add_filter ( ‘loginizr_logo_height’, set_loginizr_logo_height, 10, 1); 
function set_loginizr_logo_height ( $default ) { 
 return ’60px’; //default 50px 
}
add_filter ( ‘loginizr_logo_padding’, set_loginizr_logo_padding, 10, 1); 
function set_loginizr_logo_padding ( $default ) { 
 return ’10px’; //default 5px 
}
add_filter ( ‘loginizr_form_bg_color’, set_loginizr_form_bg_color, 10, 1); 
function set_loginizr_form_bg_color ( $default ) { 
 return ‘#fff’; // calid hex or rgb value, default #fff 
}
add_filter ( ‘loginizr_form_width’, set_loginizr_form_width, 10, 1); 
function set_loginizr_form_width ( $default ) { 
 return ‘400px’; //valid css width default 320px 
}
add_filter ( ‘loginizr_form_height’, set_loginizr_form_height, 10, 1); 
function set_loginizr_form_height ( $default ) { 
 return ‘100px’; //default 194px 
}
add_filter ( ‘loginizr_form_padding’, set_loginizr_form_padding, 10, 1); 
function set_loginizr_form_padding ( $default ) { 
 return ’10px’; //calid padding css, default 26px 24px 46px 
}
add_filter ( ‘loginizr_field_width’, set_loginizr_field_width, 10, 1); 
function set_loginizr_field_width ( $default ) { 
 return ‘90%’; // percentage or px value, default 100% 
}
add_filter ( ‘loginizr_field_margin’, set_loginizr_field_margin, 10, 1); 
function set_loginizr_field_margin ( $default ) { 
 return ’10px’; // valid margin: css , default 2px 6px 16px 0px 
}
add_filter ( ‘loginizr_field_bg’, set_loginizr_field_bg, 10, 1); 
function set_loginizr_field_bg ( $default ) { 
 return ‘#ccc’; // valid css hex/rgb, default #fff 
}
add_filter ( ‘loginizr_field_color’, set_loginizr_field_color, 10, 1); 
function set_loginizr_field_color ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #333 
}
add_filter ( ‘loginizr_field_label_color’, set_loginizr_field_label_color, 10, 1); 
function set_loginizr_field_label_color ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #777 
}
add_filter ( ‘loginizr_button_color’, set_loginizr_buttoncolor, 10, 1); 
function set_loginizr_button_color ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #fff 
}
add_filter ( ‘loginizr_button_bg’, set_loginizr_button_bg, 10, 1); 
function set_loginizr_button_bg ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #2EA2CC 
}
add_filter ( ‘loginizr_button_border’, set_loginizr_button_border, 10, 1); 
function set_loginizr_button_border ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #0074A2 
}
add_filter ( ‘loginizr_button_hover_bg’, set_loginizr_button_hover_bg, 10, 1); 
function set_loginizr_button_hover_bg ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #1E8CBE 
}
add_filter ( ‘loginizr_button_hover_border’, set_loginizr_button_hover_border, 10, 1); 
function set_loginizr_button_hover_border ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #0074A2 
}
add_filter ( ‘loginizr_button_hover_shadow’, set_loginizr_button_hover_shadow, 10, 1); 
function set_loginizr_button_hover_shadow ( $default ) { 
 return ‘#ccc’; //valid hex/rgb, default #78C8E6 
}
add_filter ( ‘loginizr_other_color’, set_loginizr_other_color, 10, 1); 
function set_loginizr_other_color ( $default ) { 
 return ‘#fff’; //valid hex/rgb, default #999 
}
add_filter ( ‘loginizr_other_hover’, set_loginizr_other_hover, 10, 1); 
function set_loginizr_other_hover ( $default ) { 
 return ‘#fff’; //valid hex/rgb, default #2EA2CC 
}

Loginizr

good

Control the look & feel of your WordPress login page through the WordPress Customizer.

Freemius

Shois WP

Custom Login Page Customizer and Designer – The #1 WordPress Login Page Builder
Looking for the best custom login page plugin for WordPress? This is it. Custom Login Page Customizer and Designer lets you design a fully branded, beautiful WordPress login page in minutes — no coding required.
Transform the plain default <code>wp-login.php</code> into a stunning, professional login experience. Pick from ready-made templates, customize colors, fonts, backgrounds, and animations — then go live instantly. Whether you’re an agency, SaaS platform, or membership site owner, this custom login page customizer gives you pixel-perfect control over your WordPress login page.
Stop using the boring default WordPress login screen. With this WordPress login page customizer, you get a full visual block-based editor, entrance animations, shadow presets, gradient backgrounds, and a growing premium template library — all without touching a line of code.
<h4>Why Choose This Custom Login Page Plugin?</h4>
<ul>
<li>Easiest custom login page builder — visual block editor, no coding.</li>
<li>20+ ready-made login page templates — free and pro designs.</li>
<li>Full styling control — colors, fonts, radius, shadows, spacing.</li>
<li>3 layout modes — Centered, Split Left, Split Right.</li>
<li>Entrance animations — Fade In, Slide Up, Zoom In.</li>
<li>CAPTCHA support — reCAPTCHA v2/v3, hCaptcha, Turnstile (PRO).</li>
<li>Custom login URL — hide <code>/wp-login.php</code> from bots (PRO).</li>
<li>WooCommerce login page support (PRO).</li>
<li>Import / Export — move designs between sites instantly.</li>
<li>Zero performance impact — assets load only on the login page.</li>
</ul>
<h4>Free Features</h4>
Custom Login Page Design and Customization:
<ul>
<li>Template Library — Start with professionally designed custom login page templates: Light Centered and Dark Centered.</li>
<li>Layout Modes — Choose from 3 layout types: Centered, Split Left, and Split Right to match your brand.</li>
<li>Core Blocks — Build your custom login page using 6 essential blocks: Logo, Heading, Paragraph, Divider, Login Form, and Custom HTML.</li>
<li>Flexible Styling — Full control over colors, fonts, border radius, padding, and spacing for pixel-perfect results.</li>
<li>Box Shadow Presets — Instantly apply Soft, Medium, or Strong shadow presets to your login card with a single click.</li>
<li>Entrance Animations — Add polished Fade In, Slide Up, or Zoom In animations to your WordPress login page.</li>
<li>Background Options — Set any Solid Color, Gradient, or Image as your custom login page background.</li>
<li>Global Custom CSS — Drop in your own CSS for unlimited design flexibility beyond the built-in controls.</li>
</ul>
Login Page Management:
<ul>
<li>One-Click Toggle — Enable or disable the custom login page customizer instantly without losing your settings.</li>
<li>Custom Page Title & Favicon — Set a custom browser tab title and favicon for your login page.</li>
<li>Back to Blog Link — Customize the “Back to Site” link text and URL.</li>
<li>Custom Error Messages — Replace the generic WordPress login error messages with branded copy.</li>
<li>Import / Export — Move your full custom login page design between sites with one click.</li>
</ul>
<h4>PRO Features</h4>
Login Page Security:
<ul>
<li>Premium Custom Login Page Templates — Unlock 19+ high-end templates including Glassmorphism, Midnight, Cyberpunk, Aurora, and more.</li>
<li>CAPTCHA Protection — Defend your WordPress login page against bots and brute-force attacks with Google reCAPTCHA v2 & v3, hCaptcha, and Cloudflare Turnstile.</li>
<li>Custom Login URL — Replace the default <code>/wp-login.php</code> with a custom slug (e.g., <code>yoursite.com/my-login</code>) to hide your login page from scanners and bots.</li>
</ul>
Advanced Login Redirects:
<ul>
<li>Redirect users to the Homepage or any Custom URL after a successful login.</li>
<li>Redirect users to the Homepage or any Custom URL after a successful registration.</li>
</ul>
WooCommerce Login Page Integration:
<ul>
<li>WooCommerce Support — Automatically apply your custom login page design to the WooCommerce My Account login and registration page — no extra configuration needed.</li>
</ul>
Advanced Custom Login Page Design:
<ul>
<li>Video Backgrounds — Set a looping video as your custom login page background for a cinematic look.</li>
<li>Animated Gradient Backgrounds — Apply smooth, flowing gradient animations to your WordPress login page.</li>
<li>Custom Box Shadows — Go beyond presets with precise control over X/Y offsets, blur, and spread.</li>
<li>Custom JavaScript — Inject JS code into the head or footer for tracking pixels or custom behavior.</li>
</ul>
<h3>Developer Instructions</h3>
This plugin uses WordPress scripts (<code>@wordpress/scripts</code>) to compile React-based editor and settings UIs.
To rebuild the JavaScript and CSS assets from the source files in <code>src/</code>:
<ol>
<li>Make sure you have Node.js (v16+) installed.</li>
<li>Run <code>npm install</code> to install dependencies.</li>
<li>Run <code>npm run build</code> to compile production assets into the <code>build/</code> directory.</li>
<li>For development mode with live rebuild, run <code>npm run start</code>.</li>
</ol>
Note: The <code>node_modules/</code> directory is excluded from the plugin distribution. All other source files (<code>src/</code>, <code>package.json</code>, <code>webpack.config.js</code>) are included.

Custom Login Page Customizer and Designer

The best custom login page customizer for WordPress. Design a beautiful branded login page with templates, animations, CAPTCHA & more — no coding  …

Loginizr vs Custom Login Page Customizer and Designer