Requires: WordPress 5.8+, PHP 7.4+

Features

Shortcode [btkbd] for ⌘⇧⌥⌃-style output anywhere shortcodes are supported
Symbols or text: Mac/Windows modifier symbols (⌘, ⇧, ⌥, ⌃) or text labels (Command, Shift, Option, Control)
Automatically sort modifiers in the order specified by Apple’s guidelines
Editor integration: Insert keyboard shortcut dialog in the classic and block editors
Settings page: Toggle + separator, modifier symbols, key symbols, Mac vs Windows naming, and built-in visual presets
Core CSS workflow: Style .btkbd keyboard keys using WordPress’s built-in Additional CSS editor

Installation

In WordPress admin, go to Plugins > Add New, search for BT Keyboard Shortcuts, and install from the Plugin Directory listing: BT Keyboard Shortcuts on WordPress.org.
Or download the latest release and unzip.
Upload the bt-keyboard-shortcuts folder to /wp-content/plugins/.
Activate the plugin via Plugins in WordPress.
Go to Settings (under the plugin on the Plugins page) to configure display options.

Plugins page: BT Keyboard Shortcuts with Settings link — BT Keyboard Shortcuts plugin with Settings link highlighted

Inserting shortcuts in the editor

In the block or classic editor, use the formatting dropdown and choose Insert keyboard shortcut to open the shortcut dialog.

Editor dropdown with Insert keyboard shortcut option — Editor formatting menu with Insert keyboard shortcut option

In the Keyboard shortcut dialog, check modifier keys (Win/Alt/Shift/Ctrl/Fn), enter the main key, and use the generated shortcode. Click Insert to add it to the content.

Keyboard shortcut dialog with modifiers and generated shortcode — Keyboard shortcut dialog with modifiers, key field, and generated shortcode

Settings

Under Settings → Keyboard Shortcuts (or via the plugin’s Settings link), you can:

Display: Show + separator (e.g. ⌘+⌥+S), use modifier symbols (⌘⇧⌥⌃) vs text, use symbol entities for keys (Tab, Return, etc.), choose Mac or Windows symbols and names, and pick a built-in style preset (Default, Light, Dark, Modern).
Styling: Use WordPress core Additional CSS (or block-theme Site Editor equivalent) to style .btkbd keyboard keys.

Keyboard Shortcuts settings: Display options — Settings page with display options

Shortcode syntax

Syntax	Example	Output
Modifiers + key	`[btkbd cmd shift p]`	⌘⇧P (symbols, combined)
Shortcut symbols	`[btkbd $@p]`	⌘⇧P
Hyphenated text	`[btkbd Command-Shift-P]`	⌘⇧P
Arrow keys	`[btkbd right]`	→ Right Arrow

Display format (symbols/text and plus separators) is controlled by plugin settings.

Supported modifiers

cmd/command, ctrl/control, opt/alt, shift, fn, hyper

You can also use symbol shorthand in the shortcode: $ (Shift), @ (Command/Win), ~ (Option), ^ (CTRL). For example, [btkbd @$p] renders as ⇧⌘P.

Modifier keys are automatically rearranged to match the order recommended by Apple in their Human Interface Guidelines (e.g. ⌃ ⌥ ⇧ ⌘ before the key), regardless of the order you type them.

Key names

tab, return, enter, delete, esc, right, left, up, down, pgup, pgdn, home, end, space, caps, f1–f12

Frontend output

On the frontend, the shortcode renders as styled keycaps (e.g. ⇧ ⌘ L and ⌥ ⌘ V), using your display settings and theme/CSS styling.

Rendered keyboard shortcuts: Shift-Command-L and Option-Command-V — Rendered shortcuts: Press ⇧⌘L and then ⌥⌘V

License

GPLv2 or later.