10 Helpful Gutenberg Editor Tips And Tricks

With the new Gutenberg editor release in WordPress 5.0 just around the corner, we thought we would share some tips and tricks to help you get started using the new editor. Here they are:

1. Multiple Editor View Options

You have a few options as far as the ‘editor view’ goes. To find these options, there is an ellipsis in the top right corner, if you hover over that, it says ‘more’. Once you click on that, you will see the options in the screen shot below:

a) Unified Toolbar:
Depending on how you want to view your toolbar, you have the option to have a unified toolbar at the top of the editor, or have the toolbar visible at the top of the block you are working on.ย When you have the check-mark on unified toolbar, you will see the toolbar at the top, when it’s not checked, the toolbar is visible above each block when you hover over it.

b) Spotlight Mode:
The spotlight mode is another option – it highlights with bold the block you are currently working on, and fades the blocks that you are not working on so itโ€™s easy to focus on what you are working on.

c) Fullscreen Mode:
Full Screen mode expands the editor so you can just see the editor, and it removes the WordPress admin menus at the top and to the left. Another good option if you want more space for the editor to help keep your focus and remove distractions.

Notice how you can play around with using all or just a couple of these different viewer options. They are easy to change around so great if you need to change the view frequently to optimise your WordPress experience.

2. Keyboard Shortcuts

Another great feature of the Gutenberg editor is the Keyboard shortcuts. You will also find these by clicking on the ellipsis in the top right corner (where you find the viewer options), further down the menu. Please note that some of the shortcuts might vary depending on which keyboard you are using.

3. Copy multiple blocks

With the new block style blogging, you might be wondering how you can copy all of the content in the blog at once. This is possible by again clicking on the ellipsis on the top right and at the very bottom of the menu you will see the Copy All Content. When you click on the if will momentarily say ‘Copied!’

4. Moving blocks

Blocks can be easily moved around. If you hover over a block, you will see and up and down arrow as well as a dotted icon to the left of the block. If you hit the up or down arrow, this will move the block, or you can click on the dots and drag and drop the block anywhere in the post. You can still see a preview of where it was.

5. Changing block types

To change your block type, hover over block and click over current block type option. It will give you the option to change to a different type. Every block type can only change to a certain block type that makes sense with whatever content already exists in the block. (i.e. if there are words written it wonโ€™t be possible to change to a gallery or image).

6. Adding new blocks

There are several ways to add blocks. To add block below the current block, hit return at the end of that particular block and it will appear.

Another option is to click on the plus sign icon at the top left, which will add a block after whatever block you are currently in.

For a fourthย  option, typing Alt+Ctrl+T adds a block on the top of the current block and Alt+Ctrl+Y adds a block on the bottom.

One more way to add a block is to click on the ellipsis on the block and choose to insert block on top or bottom. As you can see there are a lot of ways to add blocks to keep it easy to do so.

7. Removing blocks

As for removing block, there are less options. If you click within a block and hit Alt+Ctrl+delete/backspace. The other option is to click on the ellipsis and then remove block.

8. Advanced block options

You can find Advanced Block Options under the Settings icon (next to the ellipsis in the op right corner). You will see more options if you go into that which will be contextual with the content that is already in block. (i.e. if a list will give you list options or a heading then will give you heading options, etc.)

9. Post structure info

The Info Icon closer to the top left is helpful if you need information like word count, number of headings, paragraphs, and blocks, and even a summary of the entire blog layout.

10. Search for blocks

Search for blocks, gives you options with that specific, i.e. image or video. This is very helpful since there are a lot of block options and it helps you find what your looking for more quickly and with more ease.

Feedback and questions

We hope you find these tips helpful in navigating the new Gutenberg editor. You can test them out at the Gutenberg Test website to familiarise yourself with the new look and new way of using WordPress. Let us know if you have any questions, if you want to share information you have learned, and/or if there is something you’d like us to cover in more detail as we will be doing more of these posts to get ready for Gutenberg.

Image Credit: Icon made by Freepik from www.flaticon.com

0 comments on “10 Helpful Gutenberg Editor Tips And Tricks

Leave a Reply

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