Set Default Theme and Configure Toggle Button

Set the Default Theme

The default theme for the template is dark mode. If you want to change it to light mode, follow these steps:

  1. Open the js/dark-light-theme.js file.

  2. Locate the following line at line 5:

    const defaultTheme = 'dark';
  3. Change the value 'dark' to 'light':

    const defaultTheme = 'light';
  4. Save the file. The default theme will now be set to light mode.


Hide the Theme Toggle Button

If you don't want users to switch between dark and light themes and prefer to lock the theme to your chosen default, you can simply hide the toggle button:

  1. Open the css/styles.css

  2. Add the following CSS rule:

    #theme-toggle {
        display: none;
    }
  3. Save the file. The toggle button will no longer be visible in the header, but the code will remain in case you want to re-enable it later.

Last updated