Theme Light Dark
add theme light dark functionnalities.
by Joan Fernandez · github.com/papamundodev/theme_light_dark · website
★ 0stars
0forks
Install
No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:
wp plugin install https://github.com/papamundodev/theme_light_dark/archive/refs/heads/main.zipDeclares an update source (https://joanfernandez.com/), so updates arrive through the plugin's own updater.
From the readme
Theme Light Dark WordPress Plugin
A simple and elegant WordPress plugin that adds a light/dark theme toggle functionality to your website. The plugin automatically detects the user's system preferences and allows manual toggling between themes.
Features
- Automatic system theme detection
- Manual theme toggle button
- Theme preference persistence using localStorage
- Smooth icon animation
Installation
1. Download or clone this plugin into your WordPress plugins directory (wp-content/plugins/)
2. Activate the plugin through the WordPress admin panel
3. Add the shortcode [themelightdark] where you want the toggle button to appear
Usage
Adding the Toggle Button
The most common placement is in the header. Add this code to your theme's header.php:
Theme Integration
To make the theme switching work properly, ensure your theme's CSS uses these variables:
How It Works
1. The plugin first checks the user's system preferences using prefers-color-scheme
2. If no preference is saved, it applies the system preference
3. When the toggle button is clicked, it switches between light and dark themes
4. The user's preference is saved in localStorage for future visits
5. The theme toggle