With WordPress 5.0 schedule for release in 2018 there is a lot to look forward to.  One of the new features is a brand new content editor named Gutenberg.  This editor is setup similar to popular page builders where you have content blocks and they build on each other.  This should make content creation for posts much more user friendly.

Table of Contents:

Introduction to Gutenberg

What is great, is that you do not have to wait for version 5 of WordPress to play around with Gutenberg.  You can download and install the plugin right now!  The plugin is available at the official WordPress plugin directory, https://wordpress.org/plugins/gutenberg/

However, there are some caveats to using this plugin.  One of the biggest being compatibility with other plugins.  For example, popular eCommerce plugin, woocommerce, has issues with plugin.  It is worth strongly noting that this is still a work in progress so these hiccups are expected during the development period, and should be mostly ironed out once WordPress 5 gets released.  For now, it is not recommended to install the plugin on a production site and to use it in testing environments. 

So far the team behind it has been amazing at responding to feedback, so any offered is greatly appreciated.  With all of that out of the way, let's dive into what Gutenberg can do now!

This post was written using version 3.6.0 of the plugin, but updates come out regularly so we will have to revisit Gutenberg again.  The first thing to note, is that there is a backwards compatibility layer that lets you use the current content editor if you would like.  This should help with plugins that have not updated to work with the new block editing of Gutenberg.

 

compatibility layer

Starting off, Gutenberg looks pretty bare and nothing like the older WordPress editor.  You have your title and the option to add a new content block.  Next to that we have the Document section and Block settings section.  The Document section holds a lot of familiar options that long time WordPress user's should know.

gutenberg overviewGutenberg's Document Settings

 

 

 

 

 

 

 

 

 

 

 

 

 

When working with Gutenberg, you will work with content blocks.  A content block can be anything from a block of text, an image, or really anything.  The idea is that plugin developers can create their own blocks to add content to a page/post.  Our of the box, Gutenberg has quite the selection of blocks.

blocks view

Playing around with Gutenberg

Let's start working on a WordPress post using Gutenberg.  Starting off we have the familiar title.  The title block is used to edit the title and view the permalink URL, and underneath, we have a place to input a block.  There are some quick selections that is generated based on your previous used blocks.

gutenberg title block

In this example I will be creating a photo gallery with some text.  We'll start with the paragraph block to give our post some text.  There are some nice options in the Block settings section to change elements like text and color settings. 

Gutenberg paragraph block

 We now get to one of Gutenberg's quirks, adding blocks.  It is easy to add a block above my paragraph block, but I cannot seem to one click add a block to the bottom.  In order to add it I need to go into the menu for the paragraph block and insert a new block below it.

adding Gutenberg blockNext I added my gallery block.  The gallery block is a bit on the lackluster side, not offering a lot of option.  You get the ability to add captions to the images, change the columns, and what the images link to.  On the plus side, I am able to add blocks under the gallery block without having to go into the block menu. 

Gutenberg photo gallery

 

 Finally, I'll add a classic block.  The classic block is just the classic editor, but in a block.  Kind of redundant, since the paragraph block does the same thing but I guess it is there for compatibility. 

 classic blockFinal thoughts on Gutenberg

Overall, I really enjoyed what Gutenberg has to offer.  There are some odd quirks, but updates are being released regularly so the project is advancing, which is great.  I look forward to doing another look at the finished product when it is shipped with WordPress 5.