Learn keystroke (keyboard) shortcuts in Modern Editor. You'll have the most support for shortcuts in Chrome. Learn what you can do in this support post!
Topics covered in this article:
Quick Actions
We've developed some quick actions in Modern Editor to help users move around the tool quickly.
| ACTION |
MAC | PC |
| Toggle full preview | Command + ; | Control + ; |
| Close block editor | ESC | ESC |
| Open Blocks tab | Command + Shift + B | Control + Shift + B |
| Open Stylesheet tab | Command + Shift + S | Control + Shift + S |
| Save | Command + S | Control + S |
Content Editing Shortcuts
The following table provides keyboard shortcuts for editing text in Modern Editor text blocks.
| ACTION |
MAC | PC |
| Bold text | Up/Down Arrow | Up/Down Arrow |
| Italicize text | Shift + Up/Down Arrow | Shift + Up/Down Arrow |
| Undo text changes | Command + Shift + U | Control + Shift + U |
| Add soft line break (Safari) | Command + Return | Control + Return |
| Add soft line break (Chrome, Firefox) | Shift + Return | Shift+ Return |
We built in an additional word highlight shortcut in text blocks that works across ALL browsers and both PC/Mac platforms.
In your text block, put your cursor on a formatted text in the text block, the tag applied to that text will show up in the lower left corner.
Here's an example of the cursor being placed on text that has h1 applied:
Click the tag in the lower left corner to quickly highlight that area for additional edits:
Style Editing Shortcuts
When you are working on setting up your Styles (globally or on individual blocks) in your Modern Editor design you can use these editing shortcuts in your updates.
To access your STYLESHEET:
From the edit content panel (left side) of the editor, click on the STYLESHEET tab. Then click on any Stylesheet section to edit it.
To access individual block Styles:
From the preview panel (right side) of the editor, click on any block and then click on the STYLES tab of that block. Click on any area in the Styles section to edit it.
Here are the shortcuts you can use to edit your styles:
| ACTION |
MAC | PC |
| Increase/Decrease value by 1 | Up/Down Arrow | Up/Down Arrow |
| Increase/Decrease value by 10 | Shift + Up/Down Arrow | Shift + Up/Down Arrow |
| Convert non-pixel value to 'px' | Command + Shift + U | Control + Shift + U |
*Example of Container section updated to have 25px margin:
Preview Panel Shortcuts
In your Modern Editor design you can use some built-in shortcuts to edit on the preview panel (right side) of the editor. Let's review what edits you can do on the preview panel:
| ACTION |
MAC | PC |
| Duplicate or Delete blocks | Right-Click or Control-Click | Right-Click or Control-Click |
| Click mobile icon to zoom into mobile mode | Slider bar | Slider bar |
| Click desktop icon to zoom into desktop mode | Slider bar | Slider bar |