• Skip to primary navigation
  • Skip to main content
Sal Ferrarello
  • About Sal Ferrarello
  • Speaking
  • Connect
    Mastodon GitHub Twitter (inactive)
You are here: Home / Dev Tips / Display Keyboard Shortcut in WordPress Gutenberg

Display Keyboard Shortcut in WordPress Gutenberg

Last updated on October 15, 2021 by Sal Ferrarello

In Gutenberg (a.k.a. the WordPress Block Editor), keyboard shortcuts are displayed differently on Apple devices and other devices, e.g. ^H on an Apple device and Ctrl+H on other devices. This is accomplished with wp.keycodes.displayShortcut.

Here are some examples:

Ctrl+H / ^H

wp.keycodes.displayShortcut.ctrl('h')

Ctrl+H / ⌘H

wp.keycodes.displayShortcut.primary('h')

Alt+Z / ⌥Z

wp.keycodes.displayShortcut.alt('z')

Other Choices

For other choices see packages/keycodes/src/index.js in the WordPress Gutenberg GitHub repo.

Related Reading

@wordpress/keycodes

Sal Ferrarello
Sal Ferrarello (@salcode)
Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.

Share this post:

Share on TwitterShare on FacebookShare on LinkedInShare on EmailShare on Reddit
Warning! This is a draft, not a finalized post. See full draft disclosure.

Filed Under: Dev Tips, Draft, Programming Tagged With: Gutenberg, JavaScript, WordPress

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Copyright © 2023 · Bootstrap4 Genesis on Genesis Framework · WordPress · Log in