image of gutenberg

Everything You Need To Know About Gutenberg

On December 6, 2018, we saw the official release of WordPress 5.0. This milestone update has brought with it a new editor called Gutenberg, which is scheduled to replace Tiny MCE as WordPress’ default editing software.

The WordPress community is currently in an uproar over the changes – the average rating for the new editor is sitting at a meagerly 2 out of 5 stars, with over 1500 negative reviews at the time of writing. Criticisms seem to be coming from all sides. The most common complaints concern missing or broken features, backward compatibility issues, UI and UX problems, and the fact that the update was pushed on everyone without their consent.

The controversy surrounding the unfortunate editor has made it more difficult to objectively assess its pros and cons. Partisans from both sides are busy either with singing praises or with writing condemnations, while people watching from the sidelines have no clue what’s going on.

So in order to cut through the noise and do the topic justice, we wrote an unbiased overview of the Gutenberg editor, focusing on its features, pros, and cons.

What is Gutenberg?

As mentioned, Gutenberg was the project name for the new WordPress editor. The name itself stems from Johannes Gutenberg, the inventor of the printing press. The latest version of Gutenberg is 4.8.0, and it requires a WordPress installation of version 4.9.8 or higher to run. Since its release, Gutenberg has accrued more than 200,000 active installations.

According to the WordPress team, Gutenberg will be rolled out in three stages. So far only the first stage has been released. The goal was to introduce a new post editing system based on content blocks, which we will explore later in detail. The second stage aims to expand functionality with a page template system, and the third stage is scheduled to provide full website customization.

Features

Gutenberg uses a block-based content editing system. A Gutenberg block is a unit of content that contains common web page elements such as headings, paragraphs, lists, images, tables, etc. Gutenberg blocks can also contain WordPress shortcodes, widgets, plugins, and custom HTML code.

Gutenberg offers the option to freely switch between its block-based editing interface and a standard HTML editor. Blocks are reusable by design – they can be moved around, duplicated, or saved as templates for later use. Each type of block has additional settings based on the kind of content it contains.

Blocks are not rendered as such when a page loads. Instead, they compiled into regular HTML, CSS, JavaScript by Gutenberg in the background.

Other features that Gutenberg provides include:

  • Mobile Compatibility – Gutenberg allows you to edit content from mobile devices. This feature is useful for adding content on-the-fly.
  • Responsive Columns – Making responsive columns is something WordPress users always tended to struggle with, and the new Text Column block exists to alleviate the issue.
  • Live HTML Blocks – Blocks fully support HTML snippets, which means you don’t have to switch to HTML editor mode to add live HTML to your page.
  • Shortcuts – When creating blocks, you can use the slash (‘/’) symbol followed by the name of the block you wish to make.
  • Page Anchors – Anchors have been a long-requested feature, and it has finally been introduced with Gutenberg. You can find it the block settings sidebar.
  • Content Structure Information – Gutenberg’s UI allows you to see the entire content structure of your page at a glance, providing counters for words, blocks, headings, and paragraphs
  • Block Navigation – The interface also provides handy navigator feature, which enables you to jump straight to any block, no matter where you find yourself on the page
  • Built-in Theme – Gutenberg comes with a new default theme called Twenty Nineteen. The theme features ample whitespace, serif paragraphs, sans-serif headings, and is optimized for speed.

Pros

Despite what its most ardent critics have been claiming, Gutenberg has some unmistakable advantages over its predecessor. Many eCommerce development companies and WordPress theme designers are starting to embrace Gutenberg for reasons including:

  • The block-based drag & drop system Gutenberg uses makes it easy for beginners with the platform to pick up. Almost no technical knowledge is required to create a web page that looks and functions better than most older websites.
  • The user interface is non-intrusive, and it is arranged in such a way to provide ample whitespace, which makes content creation more enjoyable.
  • Gutenberg is responsive by design, which makes it easy to create a website from any internet-capable device. The block system works especially well in combination with a touch-based interface.
  • It uses a workflow that is similar to the ones found in SquareSpace, Ghost, and other website builders. People using these platforms can jump into editing content straight away.
  • Features such as page anchors, responsive columns, CSS Class fields, and others have been requested for a long time, and Gutenberg finally delivers on the promise, with more to come in the future.
  • Many of the functions that previously had to be implemented through third-party plugins are scheduled to become a part of the core WordPress package through Gutenberg, thus simplifying the process of making a website.
  • Gutenberg is not mandatory to use, at least until 2021. To disable the new editor, you can install the Classic Editor plugin, which will revert things to the way they were before the 5.0 update.

Cons

No piece of software is perfect, and Gutenberg has its own share of flaws. Whether they are a deal-breaker or not largely depends on what you are looking for in a content editor. While the community response has largely been negative, this doesn’t necessarily mean that Gutenberg is not the right choice for you. The main issues with Gutenberg are:

  • Bugs with the user interface. The buttons for adding and manipulating blocks are still somewhat finicky, which would be acceptable if Gutenberg was still in beta, but a full release should be free of such bugs.
  • As a consequence of trying to make Gutenberg more mobile-friendly, some features now have to be accessed in more roundabout ways, which is causing problems for desktop users, who are still the majority.
  • As of yet, Gutenberg doesn’t offer full support for shortcodes and meta-boxes. Since many WordPress websites rely on these features, Gutenberg can be a tough sell for more advanced users.
  • Web developers are comfortable to work with raw code, and the shift towards a more layman-friendly drag-and-drop block system will make it more difficult to write efficient code.
  • Gutenberg doesn’t fully support formatted copy-pasting. There is still no way to easily convert content from Word, Markdown, and Google Docs into Gutenberg blocks.
  • Backward compatibility is likely to become an issue for third-party plugins and themes. It is impossible to predict how future changes to Gutenberg will impact older third-party content.
  • Once Gutenberg becomes a part of the core WordPress package down the line, there will be no way to turn it off. And if WordPress tries to force its supporters to use a system they don’t like, they will be more likely to migrate to competitor services.

Conclusion

The new Gutenberg editor has its share of pros and cons, same as with any other piece of software. While the initial reception was far from positive, the team behind Gutenberg has promised to address community concerns regarding bugs, missing features, and performance issues.

At its core, Gutenberg is a good piece of software, it just needed a bit more time in the oven before it was fully ready for prime time. Fortunately, the team has plenty of time to turn Gutenberg into a worthy successor to Tiny MCE in the coming months. So cast your worries aside, and start preparing for the next-gen editing experience.

blank

By Daniel Bishop

Daniel Bishop started off as a content consultant for small SEO and web design companies. Online consulting was perfect for him as he is very social and loves to travel. Settling down in Europe, for the time being, he finally found his place as a junior editor for Design Rush a B2B marketplace connecting brands with agencies. Always searching for new opportunities, he loves sharing ideas with other professionals in the digital community.

Leave a comment

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.