Change Mode (Light/Dark)

Template modes

Digit has two modes, light and dark. By default the template uses dark mode. To switch to light mode, follow the steps below.

Change to light mode

1. Open WHMCStemplatesdigitincludeshead.tpl and search for

   head.tplSmartyCopy

   <link href="{assetPath file='theme-dark.css'}?v={$versionHash}" rel="stylesheet">

   Change it to

   head.tplSmartyCopy

   <link href="{assetPath file='theme-light.css'}?v={$versionHash}" rel="stylesheet">

2. Open WHMCStemplatesdigitheader.tpl and search for

   header.tplSmartyCopy

   <img src="{$WEB_ROOT}/templates/{$template}/img/theme-dark-logo.png" alt="{$companyname}">

   Change it to

   header.tplSmartyCopy

   <img src="{$WEB_ROOT}/templates/{$template}/img/theme-light-logo.png" alt="{$companyname}">

3. Open WHMCStemplatesdigithomepage.tpl and search for

   homepage.tplSmartyCopy

   <img class="domain-bg" src="{$WEB_ROOT}/templates/{$template}/img/theme-dark-domain-bg.png" alt="domain">

   Change it to

   homepage.tplSmartyCopy

   <img class="domain-bg" src="{$WEB_ROOT}/templates/{$template}/img/theme-light-domain-bg.png" alt="domain">

4. Open WHMCStemplatesorderformsdigitcommon.tpl and search for

   common.tplSmartyCopy

   <link rel="stylesheet" type="text/css" href="{$WEB_ROOT}/templates/orderforms/digit/css/form-theme-dark.css?v={$versionHash}" />

   Change it to

   common.tplSmartyCopy

   <link rel="stylesheet" type="text/css" href="{$WEB_ROOT}/templates/orderforms/digit/css/form-theme-light.css?v={$versionHash}" />

Digit can also follow the visitor’s system setting. Learn how to disable auto detect for light/dark mode.