Light / Dark Mode Customization
The Light/Dark Mode setting allows you to toggle between two distinct interface appearances—Light Mode (the default, brighter interface) and Dark Mode (a darker interface designed for low-light environments). This flexibility helps reduce eye strain, especially for users who spend extended periods working within the WordPress admin dashboard.
How to Enable Light/Dark Mode in WP Adminify
1. Navigate to the Light/Dark Mode Settings:
- Go to the WP Adminify settings from the WordPress admin dashboard.
- Look for the Light/Dark Mode toggle under the Customize tab or a relevant appearance section.
2. OR use the mode switcher at the top right of your WordPress dashboard beside your profile icon. You can toggle between:
- Dark mode
- Light mode
- System
3. Layout Mode Options:
- Light Mode: This is the default interface mode that provides a bright, traditional look. It’s ideal for well-lit environments and offers a clear and straightforward view.
- Dark Mode: This mode applies darker tones to the interface, which is perfect for users working in low-light environments, as it reduces eye strain and makes the dashboard easier on the eyes.
4. To toggle between Light Mode and Dark Mode, simply select the button next to the desired layout mode.
Logo Type
The Logo Type option gives you control over how the logo is displayed in either light or dark modes. You can choose between:
1. Image Logo:
- This option allows you to upload and use a custom image as your logo. It is ideal if you have a brand logo that should be visible in the dashboard.
2.Text Logo:
- Alternatively, you can select a Text logo option if you prefer using text-based branding rather than an image. You can customize the text style, font, and color to match your brand identity.
Setting a Logo for Light Mode
When Light Mode is enabled, you’ll have the option to upload a specific logo for this visual layout.
1. Light Logo:
- You can upload a custom Light Logo for the dashboard. Typically, a logo with darker colors is recommended for Light Mode since it will stand out better against the bright background.
- Click the Add Light Logo button to upload your desired logo image. Supported formats include PNG, JPEG, SVG, and WEBP.
2. Logo Size:
- Adjust the size of your logo to fit perfectly within the admin interface. The Logo Size option allows you to customize the width and height of your logo using a pixel-based input.
- Example: A common size might be 120px width by 32px height (as displayed in the image), which ensures the logo doesn’t overwhelm the interface and remains visible.
- You can use the toggle to switch between measurement units like px (pixels) and em if you prefer relative units.
Customizing the Logo in Dark Mode with Text
The dark mode in WP Adminify offers a darker, more subdued appearance suitable for low-light environments.
1. Logo Type:
- Image: Upload a custom image logo.
- Text: Use text to represent your brand as a logo. This setting is selected in the image, allowing for a customizable text-based logo.
2. Logo Text:
When the Text option is selected for the logo type, you can enter the text you wish to display as your logo. In the provided image, "WP Adminify" is used as the logo text.
3. Logo Text Typography:
- Font Family: Select a font for your text logo from the available fonts. This allows you to match your brand’s identity with a specific font style.
- Font Size: Adjust the size of the text logo. The size is customizable in pixels (px), allowing you to make the text as large or small as you need.
- Letter Spacing: Control the spacing between each letter in your text logo. Adjust this setting in pixels to either tighten or loosen the letter spacing according to your preference.
- Font Color: Choose the color of your text logo. Since Dark Mode is selected, you might want to choose a light color for the text to ensure it stands out against the dark background.
These typography settings allow for extensive customization, ensuring that your text logo fits perfectly with the overall appearance of your admin dashboard in Dark Mode.
Setting a Logo for Dark Mode
If you choose to enable Dark Mode, you will have the ability to upload a logo that is optimized for this layout mode.
1. Dark Logo:
- For the Dark Mode layout, it's recommended to use a logo that features light colors or is specifically designed to contrast well against the dark background. This ensures that the logo remains clear and prominent when Dark Mode is enabled.
- As with Light Mode, you can upload the logo by clicking the Add Dark Logo button and selecting your custom file.
2. Automatic Logo Switching:
- WP Adminify ensures that the logo automatically switches based on the selected mode. For example, if a user toggles from Light Mode to Dark Mode, the corresponding dark logo will be displayed without requiring any manual intervention.
Schedule Dark Mode
The Schedule Dark Mode feature allows you to automatically switch between Light and Dark Mode at specific times or based on your system. For example, you might prefer to have Dark Mode activate automatically in the evening.
- Disable Schedule Dark Mode: When this setting is disabled, as shown in the image, you can manually toggle between Light and Dark Mode without any automatic changes based on the time of day.
- Enable Schedule Dark Mode: Toggle this setting to enable scheduling. When enabled, you can set the times during which Dark Mode will automatically activate and deactivate.
Didn’t find what you were looking for? Get in touch!
Updated on December 2, 2024
Was this helpful to you?