# 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.

Source: https://www.jpkc.com/db/en/guides/jpkcom-bs-dark-mode/

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:

```text
[jpkcom-bs-dark-mode]
```

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

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

For more on `do_shortcode()`, see the [WordPress function reference](https://developer.wordpress.org/reference/functions/do_shortcode/).

## 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

- Source code on GitHub: <https://github.com/JPKCom/jpkcom-bs-dark-mode>
- API documentation (PHPDoc): <https://jpkcom.github.io/jpkcom-bs-dark-mode/docs/>
- `do_shortcode()` in the WordPress reference: <https://developer.wordpress.org/reference/functions/do_shortcode/>
- [This project's changelog](https://www.jpkc.com/db/en/changelog/jpkcom-bs-dark-mode/)

