What is the WordPress Gutenberg editor?

2022-04-09

2 min read

What is the WordPress Gutenberg editor?

WordPress is the most popular CMS in the world and the Gutenberg editor is its most significant change since 2003. It was introduced in Wordpress version 5.0 which came out in 2018 and it replaces the previous Tiny MCE editor with a block based drag and drop interface.

The Tiny MCE editor was not well suited to creating modern multimedia heavy websites. To add media content or other HTML elements you would need to paste code directly into the content box. It was difficult to see your changes without toggling back and forth between the editor and the live site.

MCE editor

Page builders like Elementor and Beaver came onto the market to allow non-coders to create complex layouts in WordPress. Gutenberg is a version of this built-in to the core of Wordpress itself. To use it you need to install the open source WordPress software on a web host and choose or create your theme.

All pages and posts built with Gutenberg consist of blocks. These can be text, different types of media, shortcodes, and even layout elements like columns. For a complete list check out https://gogutenberg.com/blocks/

The Gutenberg editor enables you to (amongst many other things):

Drag and drop blocks onto a page

Adding content blocks to your design is as easy as point and click. Because the blocks are discrete chunks of content it is easy to rearrange and swap them out. You can also see at a glance how all the elements of the page will work together.

Embed rich media content

Embed blocks allow you to insert content like video, audio, images and social media content without having to use an iFrame. There is a generic embed block and specific ones for popular sites like YouTube or Twitch.

Reuse blocks

There may be pieces of content that you want to use several times across your site. With Gutenberg you can create a block that is available for use on all pages. This avoids duplicating code and helps your design stay consistent.

Gutenberg brings WordPresss up to date with current trends in web development and the WordPress REST API and WP GraphQL project allow its powerful CMS to be used with any front end framework.

To read more about Gutenberg and and to try it out go to https://wordpress.org/gutenberg/