Dark mode for the whole website
Dark Mode gives the whole website a dark mode with Datoden's own engine – with a button, following the system and in the admin. Pro makes it your own.
In WordPress the plugin is called Datoden Dark Mode – in the DT-addons menu it is listed as DT-darkmode.
DT-darkmode gives your website a dark and a light mode. The plugin's own engine reads your theme's stylesheets and works out a dark version of the colours – nothing is loaded from other servers. A round button in the corner lets visitors choose Follow system, Light mode or Dark mode.
A round button in the bottom right or bottom left corner opens the choices Follow system, Light mode and Dark mode. The choice is stored in the visitor's browser and used on the next visit. You can turn the button off under Button.
Under Default mode you decide what applies until visitors choose for themselves: Follow system (the setting on their device), Light mode, or Dark mode from the very first visit.
The engine converts your theme's colours, including hover states, CSS variables and colours written directly in the page. Brand colours such as coloured buttons stay, images and videos are left alone, and small dark icons turn light. To keep part of a page as it is, add the attribute data-dt-dark-ignore to the element.
The mode is set before the page is painted, so it never shows in the wrong mode first. The cache of common cache plugins is cleared automatically when you save the settings.
With Also in the admin, the WordPress admin gets the same button and the same mode as the website. The choice is shared between the admin and the site.
The login page follows the same mode as the admin and gets the button too. The Log In button keeps its blue colour and the links are made easy to read.
Below the settings, enter a page on your site and click Check the contrast. The page is read in light and dark mode and every text is measured against its background using WCAG 2.1 (4.5:1, or 3:1 for large text). It all runs in your browser, and texts that are hard to read are listed.
Add a CSS class such as dt-colormode-toggle to a menu item and it switches the mode instead of the button. Pick the button's colour under Accent colour and change its wording per language under Texts on the button – ready-made texts are included for ten languages.
Everything without a Pro label works for free. What is marked Pro is included in the Pro version.
After installing – how to set up Dark Mode.
Go to DT-addons → DT-darkmode in the WordPress menu. Dark mode is on straight after installation, and changes are saved automatically.
Under Default mode, pick Follow system, Light mode or Dark mode for visitors who have not made a choice.
Under Button, choose Bottom right or Bottom left, or turn the button off. The preview shows how it will look.
Open the website and switch modes with the button. If your cache plugin is not cleared automatically, clear its cache.
Pro builds on the free version – it stays as the base, with all your settings, and Pro adds the rest.
Everything in the free version, plus:
Choose how many websites and how you want to buy. Prices exclude VAT – VAT is calculated at checkout.
The licence follows your Datoden account – no key to paste.
The purchase is saved on your Datoden account as soon as the payment has gone through.
Get the Pro plugin under My account → My purchases → Licences.
Drop the zip file on Website Guard. Pro is added on top of the free version – everything you have done stays.
Connect the website in Website Guard. The Pro updates then arrive as ordinary WordPress updates.
No. Images and videos are not changed, and brand colours such as coloured buttons are kept. Small dark icons are made light so they stay visible.
Yes. Add the attribute data-dt-dark-ignore to the element and the engine leaves it alone.
No. The engine and the button run from the plugin itself, with no external requests and no tracking.
Yes. It is stored in the visitor's browser and applies until they choose something else.
Yes. The cache of common cache plugins is cleared automatically when you save. With other cache plugins, clear the cache yourself after making changes.
Nothing stops working. A purchase never runs out, and when a subscription ends the plugins keep every function – only the updates from Datoden stop.
The first number in the version. A purchase includes every update in that major version, for example all 1.x versions. A new major version (2.0) comes about once a year with clearly new features and comes at a discount as an upgrade. A subscription always includes it.
Websites connected to your Datoden account with a Pro plugin switched on, in the order they were connected. Disconnect a website in My websites to move the licence to another.
No. The website is connected to your Datoden account with Website Guard, and Datoden knows which updates your licences include.
Yes. Deactivate Pro – the free version keeps running with the same settings. Functions that only exist in Pro stop, but nothing is deleted.
Yes. Pro is an add-on: the free version stays installed and active as the base and is updated from WordPress.org as usual, and Pro adds the Pro features on top. On WordPress.org the free versions are called Datoden …, for example Datoden Dark Mode.
Prices exclude VAT. VAT is calculated at checkout from your country. Companies in other EU countries can enter their VAT number.
Your licences, websites and downloads are under My account → My purchases → Licences.
