2026-06-18 16:00:11 +02:00
2026-06-18 16:00:11 +02:00
2026-06-18 16:00:11 +02:00
2026-06-18 16:00:11 +02:00
2026-06-18 16:00:11 +02:00
2026-06-18 16:00:11 +02:00
2026-06-18 15:57:40 +02:00
2026-06-18 16:00:11 +02:00

Blocksy Light/Dark Toggle

WordPress plugin that adds a floating light/dark mode toggle for the Blocksy theme v2.1+ (tested with v2.1.38).

Features

  • Beatwise-specific dark-mode fixes (menu, footer, brand purple, /codes, reservations)
  • Floating switch button (default: bottom-right)
  • Uses Blocksy's native theme-dark / theme-light classes on <html>
  • Integrates with Blocksy's Colour Mode Switch extension when enabled
  • Fallback dark palette when the extension is not active
  • Settings page under Settings → Light/Dark Toggle
  • Hides Blocksy header colour switch by default (configurable)
  • Remembers choice in localStorage, cookie, and user meta
  • Respects system prefers-color-scheme on first visit (configurable)
  • No flash of wrong theme (inline script in <head>)
  • Developer filters for custom integrations

Requirements

  • WordPress 6.0+
  • Active theme: Blocksy v2.1+ (or a child theme)

Installation

  1. Copy the blocksy-light-dark-toggle folder to wp-content/plugins/.
  2. Activate Blocksy Light/Dark Toggle under Plugins.
  3. Configure under Settings → Light/Dark Toggle.
  1. Enable Colour Mode Switch under Blocksy → Extensions (Blocksy Pro / Companion).
  2. Configure your Dark Mode Colour Palette in Customizer → General Options → Colors.
  3. Assign dark-mode colors to global elements and blocks in the Customizer.
  4. Keep Hide header colour switch enabled in plugin settings to avoid duplicate toggles.

When the Colour Mode Switch extension is active, the plugin does not load its fallback palette — your Customizer dark colors are used.

Settings

Option Default Description
Position Bottom right Corner placement of the floating toggle
Horizontal / vertical offset 1.25rem CSS distance from screen edge
Z-index 999999 Stacking order
Hide header colour switch On Hides Blocksy's built-in header toggle
Follow system preference On Uses OS light/dark on first visit
Animate transitions On Smooth colour change animation
Show on mobile / desktop On Device visibility

Developer hooks

// Override whether the toggle renders.
add_filter( 'blc_ldt_should_render', function ( $show ) {
    return ! is_page( 'landing' );
});

// Override initial scheme from server.
add_filter( 'blc_ldt_initial_scheme', function ( $scheme ) {
    return $scheme;
});

// Override settings array.
add_filter( 'blc_ldt_settings', function ( $settings ) {
    $settings['position'] = 'bottom-left';
    return $settings;
});

// Force-detect Blocksy colour mode extension.
add_filter( 'blc_ldt_has_blocksy_color_mode', '__return_true' );

License

GPL-2.0-or-later

S
Description
No description provided
Readme 38 KiB
Languages
PHP 58.7%
CSS 30.6%
JavaScript 10.7%