BT Keyboard Shortcuts

A WordPress plugin for inserting formatted keyboard shortcuts in your posts.

Requires: WordPress 5.8+, PHP 7.4+

Features

  • Shortcode [kbd] 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, and Mac vs Windows naming
  • Custom CSS: Override styling for .btkbd keyboard keys with live preview

Installation

  1. Download the latest release and unzip.
  2. Upload the bt-keyboard-shortcuts folder to /wp-content/plugins/.
  3. Activate the plugin via Plugins in WordPress.
  4. Go to Settings (under the plugin on the Plugins page) to configure display and CSS.
Plugins page: BT Keyboard Shortcuts with Settings link

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

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

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.), and choose Mac or Windows symbols and names.
  • Custom CSS: Override default styling for .btkbd keyboard keys. Changes update the preview below.
Keyboard Shortcuts settings: Display options and Custom CSS with preview

Shortcode syntax

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

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, [kbd @$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 and CSS settings.

Rendered keyboard shortcuts: Shift-Command-L and Option-Command-V

License

GPLv2 or later.

Download

BT Keyboard Shortcuts v1.0.0

Download BT Keyboard Shortcuts v1.0.0

WordPress Plugin to generate keyboard shortcut displays in posts.

Published 02/02/26.

Updated 02/02/26. Changelog

Donate • More info…

Changelog

Click to expand

1.0.0 — Initial release

  • New: [kbd] shortcode for rendering Apple-style keyboard shortcuts (⌘, ⇧, ⌥, ⌃) or text labels (Command, Shift, Option, Control).
  • New: Editor integration with an “Insert keyboard shortcut” dialog in the classic and block editors.
  • New: Settings page to configure + separators, symbol vs text output, key symbols, and Mac vs Windows naming.
  • New: Support for modifier aliases (cmd, ctrl, opt, shift, fn, hyper) and symbol shorthand ($ shift, @ command/Win, ~ option, ^ control).
  • New: Automatic normalization of modifier order to match Apple’s Human Interface Guidelines.
  • New: Custom CSS support for .btkbd key styling with live preview.

Speaking of BT Keyboard Shortcuts…

Related Projects