JPKCom DB
View on GitHub

JPKCom Bootstrap 5 Dark Mode Switch — Guide & Tips

Add a Bootstrap 5 dark mode switch to WordPress via shortcode — installation, shortcode and practical tips for JPKCom Bootstrap 5 Dark Mode Switch.

JPKCom Bootstrap 5 Dark Mode Switch provides the [jpkcom-bs-dark-mode] shortcode and accompanying JavaScript to add a Bootstrap 5 dark mode switch to your WordPress site.

Guide

Requirements

  • WordPress 6.9 or newer
  • PHP 8.3 or newer

Installation

  1. In your admin panel, go to Plugins → Add New and click Upload Plugin.
  2. Choose the plugin's ZIP file and click Install Now.
  3. Click Activate — the plugin takes effect immediately.

Usage

Place the shortcode wherever you want the switch in your content or template:

[jpkcom-bs-dark-mode]

In PHP templates you can output it via do_shortcode():

<?php
echo do_shortcode( '[jpkcom-bs-dark-mode]' );

For more on do_shortcode(), see the WordPress function reference.

Tips & Tricks

  • Bootstrap 5 required: The switch is built around Bootstrap 5's color mode system — make sure your theme loads Bootstrap 5 so dark mode applies correctly.
  • In the template, not the content: If the switch should live in your header or footer, embed it via do_shortcode( '[jpkcom-bs-dark-mode]' ) directly in the template instead of writing it into every post.
  • Reproducible updates: Since version 2.0.3 the plugin uses secure self-hosted updates via GitHub with SHA256 checksums and runs with declare(strict_types=1).

Further reading