DiviFlash introduces Login Customizer feature in v1.4.10 and above, allowing you to fully customize your WordPress login page to reflect your brand identity.
Let’s explore the settings and how to use them effectively.
Enable Login Customizer
- Go to WordPress Dashboard → DiviFlash → Settings.
- Toggle Login Customizer to ON.
Change Login URL Slug
Enter your preferred slug (e.g., mylogin) in the provided field to replace the default WordPress login URL (/wp-admin) with a custom URL (e.g., /mylogin).
Customize the Default Login Page
Click the Customize button to open the “Login Form” in the Theme Customizer.
Login Form Customizer Overview
Use the following options to customize your login page according to your brand preferences:
Logo
- Disable Logo: Toggle to hide logo from the login page.
- Image: Upload your custom logo to replace the default WordPress logo.
- Image Size: Adjust your logo dimensions.
- Bottom Spacing: Set space between the logo and login form.
Background
- Color/Image: Choose a color or an image as your login page background.
- Repeat: Set how the background image repeats (e.g., No Repeat, Repeat Vertically).
- Position: Select the background image position (e.g., Center, Top Right).
- Size: Define how your background image displays (e.g., Cover, Contain, Auto).
Font Family
- Font Family: Select either your default theme font or choose a custom font for the entire login page.
Form
- Remove Background: Toggle to make the form background transparent.
- Background Color/Image: Choose a color or image for the form’s background.
- Width & Height: Specify the form dimensions.
- Border: Adjust border width, radius, and color for the form.
- Box Shadow: Add shadow effects to enhance visual depth.
- Form Padding: Set inner spacing of the form.
- Input Field: Customize your input fields by adjusting text size, colors, spacing, borders, and backgrounds for default and active states.
- Label: Customize font size and color for field labels.
- Remember Me: Adjust font size and color for the checkbox label.
Button
- Text: Set button text size, color, and hover state colors.
- Background: Select button background color and hover effect.
- Border: Control button border width, radius, colors, and hover effects.
- Shadow: Add shadow effects, including hover state adjustments.
- Padding: Adjust button spacing.
Form Footer
- Lost Password: Enable/disable and customize appearance (text size, color, hover effects, decoration).
- Back to Site: Enable/disable and customize appearance similarly.
- Copyright Notice: Enable/disable a customizable notice with your own text, color, background, size, and padding.
Disable Custom Login Page
- Navigate to WordPress Dashboard → DiviFlash → Settings.
- Toggle Login Customizer to OFF.
Need Help?
If you have any questions or issues, feel free to contact our support team.