Light / dark / auto skin switching for NodeBB v4 — a ground-up rewrite of psychobunny/nodebb-plugin-night-mode for Persona and Harmony (latest versions). Tested against NodeBB v4.14.0.
The original plugin injected a lightbulb into Persona's Bootstrap 3 navbar and overlaid ~600 lines of hand-tuned LESS. This rewrite instead rides NodeBB's own bootswatch skin system: toggling switches between two admin-configured skins using the same core code path as Harmony's built-in skin switcher, so every theme element is styled correctly with zero CSS overrides to maintain.
- Light / Dark / Auto — auto follows the visitor's system dark-mode preference (
prefers-color-scheme) or a configurable time schedule (true "night" mode, in the visitor's local time). - Persona: toggle in the navbar (works logged-in and logged-out, all breakpoints). Harmony: toggle in the left sidebar next to the built-in skin switcher, plus a floating button below the
lgbreakpoint. Any other theme: floating button. - Two toggle styles (ACP option): a Light/Dark/Auto dropdown menu, or a one-click switch like the original lightbulb.
- No flash of the wrong skin: the effective skin is kept in a validated cookie, and the plugin renders it server-side on first paint — for guests too.
- Real persistence: logged-in users' choices are stored in core user settings (same as the account settings page); guests get cookie + localStorage persistence.
- Plays nicely with core: if a user picks a skin via Harmony's switcher or account settings, the plugin steps aside (mode becomes "manual") instead of fighting them. Custom skins defined in the ACP are fully supported.
- i18n:
en-GB,en-US,tr.
cd /path/to/nodebb
npm install YesilkartForum/nodebb-plugin-night-mode
./nodebb activate nodebb-plugin-night-mode
./nodebb build
./nodebb restartThen configure it in ACP → Plugins → Night Mode.
| Setting | Default | Description |
|---|---|---|
| Day skin | (forum default) | Skin used in light mode |
| Night skin | darkly |
Skin used in dark mode |
| Default mode | auto |
Mode for visitors who haven't picked one |
| Auto mode follows | system |
system = OS dark-mode preference, schedule = time window |
| Night starts / ends | 20:00 / 07:00 |
Schedule window (may cross midnight, local time) |
| Toggle style | menu |
menu = Light/Dark/Auto dropdown, switch = one-click toggle |
| Concern | Mechanism |
|---|---|
| Skin swap | forum/account/settings → changeSkin() (core), fires action:skin.change |
| First-paint skin | filter:middleware.renderHeader overrides bootswatchSkin from the nm_skin cookie (values strictly validated via meta.css.isSkinValid) |
| Client settings | filter:config.get → config.nightMode |
| ACP skin list | meta.css.getSkinSwitcherOptions() (includes custom skins) |
Notes:
- On the very first visit (no cookie yet) with a dark default/auto result, the swap happens right after load — a brief flash is unavoidable without inline head scripts; every later page load renders correctly server-side.
- Users keep using one account-level skin setting — the plugin writes through core, so the account settings page always shows the truth.
static:app.load, filter:admin.header.build, filter:config.get, filter:middleware.renderHeader
npm install
npm run lint
npm testTo enable GitHub Actions CI (lint + tests on push/PR), move docs/ci.yml to .github/workflows/ci.yml.
Persona ve Harmony temalarına açık/koyu/otomatik mod düğmesi ekler. Otomatik mod, sistem tercihini veya yerel saate göre bir zaman aralığını izler. Kaplama değişimi NodeBB'nin kendi kaplama sistemiyle yapılır; ilk sayfa yüklemesinde doğru kaplama sunucu tarafında uygulanır. Kurulumdan sonra Yönetim Paneli → Eklentiler → Gece Modu bölümünden yapılandırın.
- Original plugin and concept: psychobunny, with thanks to a_5mith for the original snippet.
- NodeBB v4 rewrite: Yesilkart Forum.
MIT