1. What is Theme mode?
Theme mode lets you customize your store’s appearance by switching between light and dark modes. This enhances user experience by adapting to different lighting conditions and personal preferences.
2. How to Set up Theme mode?
Step 1: Enable Theme mode
Go to Theme Settings > Theme mode > Toggle on Enable theme mode to activate light and dark modes.
⚠️Note: If disabled, the theme will always stay in Light Mode, and every dark colour option throughout Theme settings and inside individual sections is hidden from the editor. This makes the colour panels considerably shorter for stores that don’t use dark mode.
💡Tip: Turning theme mode off does not erase anything. Any dark colours you had configured are saved and reappear exactly as they were if you switch it back on.
Step 2: Choose a Mode
- Use device settings: Automatically matches the user’s device preference.
- Allow manual switch: Adds a toggle in the header for users to switch modes.
Step 3: Set a Default mode
Choose Light or Dark as the default mode when users first visit.
Step 4: Set the icon position on mobile
Use Position on mobile to decide where the theme mode switch icon appears on small screens.
Step 5: Click “Save” when done.
