Use Gutenberg like a pro with keyboard shortcuts

One of the great features of the new Gutenberg editor is how it enables you to create and insert content into your posts and pages using several different methods. In recent updates, the Gutenberg team has introduced some really handy keyboard shortcuts to the new editor. Learning these keyboard shortcuts will enable you to add content and build pages much quicker than you were able to in the past. 

Add content blocks via buttons

As seen in the screenshot above, there are currently three different ways to add blocks to your post or page via a button: the Unified Toolbar at the top of the page, the block inserter above a block, or the block inserter below a block. Clicking any of these buttons will pop open the same block inserter popup window where you can browse, search, and select blocks. 

This is a perfectly good way to add blocks to your post, and in a lot of ways, is a big improvement over the way we’re used to adding content via the classic editor. However, keyboard shortcuts can make content creation even quicker!

Adding content blocks via keyboard shortcuts

The latest update to the Gutenberg editor brings a host of new keyboard shortcuts to the editor. To see the full list of keyboard shortcuts, go to the post or page edit screen and click Ctrl Opt H on Mac or Shift Alt H on Windows. There are slight differences in the shortcuts between operating systems, so please reference the shortcut popup window or the tables below for specific keyboard shortcuts.

Among these shortcuts is one that helps you add blocks to your post even faster than the block inserter buttons. Whenever you are on a new line, you can hit the / key (forward slash) which will open a small popup with your recently used blocks. You can also begin typing to search for the block you’re looking for and hit enter to select it and add it to the page. See this shortcut in action in the video below.

After trying this a few times and learning the names of common blocks, you’ll see how much quicker you can add blocks. You can keep your hands planted on the keyboard and keep your writing flow largely uninterrupted. I encourage you to give this a try and see how it works! After a few days of using it myself, it became my go-to method for adding new blocks.

This is just one of several handy shortcut combos that can help you cruise through the Gutenberg editor. Below, I’ve added even more shortcuts for you to try out. Learning these shortcuts can make the Gutenberg editor even more powerful and save you valuable time while creating your content!

Gutenberg Global Shortcuts

Shortcut ActionMac Shortcut Windows Shortcut
Display shortcut window
Ctrl Opt HAlt Shift H
Save your changesCmd SCtrl S
Undo your last changesCmd ZCtrl Z
Redo your last undoCmd Shift ZCtrl Shift Z
Show or hide the settings sidebarCmd Shift ,Ctrl Shift ,
Navigate to the next part of the editorCtrl `Ctrl `
Navigate to the previous part of the editorCtrl Shift `Ctrl Shift `
Switch between Visual Editor and Code EditorCmd Opt Shift MCtrl Alt Shift M

Gutenberg Block Shortcuts

Shortcut Action Mac Shortcut Windows Shortcut
Duplicate the selected block(s) Cmd Shift D Ctrl Shift D
Remove the selected block(s) Cmd Opt Backspace Ctrl Alt Backspace
Insert a new block before the selected block(s) Cmd Opt T Ctrl Alt T
Insert a new block after the selected block(s) Cmd Opt Y Ctrl Alt Y
Change the block type after adding a new paragraph / /

Posted by Mike McAlister

Founder of Array Themes and Atomic Blocks. When I'm not punching pixels or closing brackets, I'm eating pizza, listening to vinyl, and wandering around taking photos.

Leave a Reply

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