12 Gutenberg Tips for WordPress

It’s been almost a year WordPress changed the classic editor and introduced the controversial Gutenberg editor. There are whooping 5+ million users still hold on to the Classic Editor plugin to continue creating content in old fashioned manner. In addition, there are also many plugins to disable Gutenberg editor on WordPress installation. However, this can’t go too far as many plugin and theme developers starts makings blocks for Gutenberg to integrate the functions. Yoast is one of the good examples that supports Gutenberg starting from the beginning. It also does not make sense to have plugins to disable the core WordPress feature. In this article, let us explain useful Gutenberg tips so that you can switch to this editor permanently.

Gutenberg Tips for WordPress

If you are planning to stay with WordPress for longer time, then the future is Gutenberg and you should start using it effectively forgetting the odds.

  • Use keyboard shortcuts
  • Customize Block Manager
  • Distraction free writing options
  • Create call to action blocks
  • Reusable blocks
  • Duplicate content
  • Disable pre-publish checks
  • Edit elements as HTML
  • Use Widgets blocks
  • Check new features
  • stop using page builder plugins
  • AMP Stories

1. Gutenberg Keyboard Shortcuts

The old keyboard shortcuts with classic editor will no more work with the Gutenberg editor. You can quickly get all available Gutenberg keyboard shortcuts by pressing “Control + Alt + H” keys. Alternatively, go to “Show more tools & options (three dots button) > Keyboard Shortcuts”.

You can get a handy pop-up that will show all shortcuts.

View Gutenberg Keyboard Shortcuts

2. Use Block Manager

Gutenberg has many default blocks categorized under different groups. However, it may be annoying to have so many blocks when you don’t need to use many of them. The best example is the “Embeds” having more than 30 blocks.

Gutenberg Embeds Blocks
Gutenberg Embeds Blocks

We are pretty sure that you don’t need to keep all these embedding options showing every time you try to search for a block. Click on the “Show more tools & options” (three dots) button on top right corner and choose “Block Manager” under “Tools” section.

Block Manager in Gutenberg
Block Manager in Gutenberg

This will open up a pop-up showing all available blocks on your site. Check and disable the blocks you don’t want to use on your site.

Disable Gutenberg Blocks in Block Manager
Disable Gutenberg Blocks in Block Manager

3. Distraction Free Writing  

Gutenberg offers multiple ways to use distraction free writing and focus on your work.

  • By default, it shows the relevant formatting options only when you click on the element.
  • Click on “Show more tools & options” options looks like three vertical dots on the top right corner and select “Fullscreen mode” to see the editor in full screen mode.
  • The “Spotlight mode” option will help you focus only the element you are currently working. This is useful when you have to focus on creating a list or typing lengthy paragraph.
  • Click on the gear settings icon that shows on the top right to show or hide the document or block panel on the right side.
Related:  What is Autosave and How to Manage in WordPress?

4. Use Call to Action

Gutenberg has very useful functions that were not available with the old classic editor. You can easily add colors to paragraph’s background and text to create an attractive call to action boxes. You don’t need to modify any CSS or use third party plugins for this purpose.

Add Call to Action in Gutenberg Editor
Add Call to Action in Gutenberg Editor

Similarly, you can add buttons and customize with different backgrounds inside the editor.

5. Reusable Blocks

One of the beauties in using Gutenberg is the reusable blocks. You can customize a paragraph, button or list and click on the three dots options button for that element. Choose “Add to Reusable Blocks” and provide the name for that block.

Add Reusable Block in Gutenberg
Add Reusable Block in Gutenberg

Later anytime you can insert the reusable block on any posts on your site. You can either modify locally on that post or use it as a global element.

Insert Reusable Blocks
Insert Reusable Blocks

We use the reusable blocks for inserting affiliate links throughout the site. With few clicks, we can update or modify the reusable block with different content that appears on various posts.

6. Duplicating Blocks

Similar to reusable blocks, you can easily duplicate a block on the same post and reuse. Let’s say, if you have customized a button block then you can duplicate the same button and update the text/link. Click on the “More options” button for that element and choose “Duplicate” option to create a copy.

7. Disable Pre-Publish Checks

WordPress will ask you to confirm and suggest before you publish a post every time. However, you can disable this pre-publish check if you think it is annoying. Go to “Show more tools & options > Options” and uncheck “Enable Pre-publish Checks”. Alternatively, you can also disable the check when publishing a post.

Disable Pre-publish Check
Disable Pre-publish Check

8. Edit Elements as HTML

Earlier with classic editor, you need to toggle visual and text mode to edit the source HTML on the editor. This is kind of similar process in Gutenberg that you can switch between code and visual editors using keyboard shortcut or from the option panel. In addition, you can also easily edit the HTML code of any element separately. Click on the “More options” icon on the element and choose “Edit as HTML” to view the code. You can toggle to the normal mode by selecting “More options > Edit visually” option. This is useful when you want to add nofollow to hyperlinks within the editor.

Related:  How to Set Permalinks in WordPress Admin Dashboard?

9. Use Widgets Blocks

The “Widgets” category contains many useful blocks that are not possible before. You can insert latest comments, latest posts, archives, calendar, categories, RSS, search, tag cloud and shortcode inside the post content.

Gutenberg Widgets Blocks
Gutenberg Widgets Blocks

In addition, you can also insert custom HTML inside post content using “Custom HTML” block available under “Formatting” blocks.

10. Use New Features

There are many new features available in Gutenberg. You can try for few weeks to switch over from classic editor and we think you may not return back any time.

  • The paragraph block has a “Drop Cap” option to make the first letter with drop cap style.
  • You can add additional CSS class to any individual element and add the CSS style definitions under “Appearance > Customize > Additional CSS” section.
  • Change elements from paragraph to list and convert many others.
  • Create simple, striped and fixed width tables using “Tables” block.
  • Use “Columns” and “Cover” blocks to create content that was not possible with classic editor.  

11. Stop Using Page Builder Plugins

Unlike many people curse, Gutenberg definitely has many positive things. Many of those who hate Gutenberg uses the custom page builder plugins like Visual Composer, Elementor or SiteOrigin page builder. Though these plugins are useful, content created with these page builder plugins will work only when the plugin is active on your site. The moment you disable the plugin, the content will become unreadable in the frontend. And it is a daunting task to migrate the content out of these page builder plugins.

Therefore, we strongly recommend not using custom plugin for building hundreds of posts. You can use Gutenberg or use custom plugins for building only few pages that can be easily updated.

Related:  How to Choose the Best Google Ads Agency?

12. AMP Stories    

If you are using AMP and Gutenberg plugin version, then the latest AMP Stories can be very attractive option for you. It helps you to create full page mobile friendly content to showcase to your readers.   

Conclusion

If you are not convinced or habituated with old classic editor, then Gutenberg also offer a “Classic” block under “Formatting” section. We recommend you stop using your favorite page builder and turn your focus on using Gutenberg as your default editor. This will help you to get familiar with new changes that will come with future WordPress upgrades.

Recommended Articles:

Leave a Comment