11 things you must know about Gutenberg: the new WordPress editor

11 things you must know about Gutenberg: the new WordPress editor

Gutenberg editor has become the talk of the town ever since the release of WordPress 5.0. The new WordPress editor completely transforms the editing and publishing experience for bloggers, authors, developers and website owners.

For over a decade, the classic editor, called TinyMCE (Tiny Moxiecode Content Editor), has been the integral part of WordPress without any significant changes. TinyMCE includes a simple interface and offers control to users for creating and editing the content. If you have ever used WordPress or are using it, then you are certainly familiar with the experience TinyMCE provides.

Things are going to completely change if you update your current WordPress editor to Gutenberg.

What is Gutenberg editor in WordPress?

Gutenberg is the name of latest WordPress editor that is based on the concept of blocks. This comes with a modern editing experience, allowing users to insert content in the form of blocks.

According to Matt Millenweg, Co-founder of WordPress, “The editor will create a new page- and post-building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.”

The name Gutenberg has been inspired from the name of Johannes Gutenberg, the man who invented mechanical movable type printing press around five centuries ago.

The new WordPress editor has been built on GitHub using the WordPress REST API, JavaScript, and React.

What are blocks in Gutenberg editor?

Anything that you want to add to the editor will be inserted in the form of blocks. The blocks are a new way to not only insert, but also to rearrange and style the content without much tech expertise.

In the form of blocks, you can add paragraphs, headings, sub-headings, quotes, images, videos, audios, columns, files, code, lists, buttons, embeds, and more.

Notice-worthy things about Gutenberg and WordPress 5.0

1. There is a dropdown in place of toolbar

TinyMCE editor contains a toolbar, but the new editor is going to replace that with a dropdown. To insert the blocks, you will have to click on Insert that will show a dropdown featuring the common blocks, formatting, layout blocks, and option to search.

2. More space for writing

In Gutenberg, you will find almost double writing space as compared to the TinyMCE editor. Along with more writing space, you get a distraction-free mode and option to hide unnecessary buttons. If you want even more space, then you can hide the right-hand sidebar from the Post Settings option.

The aim of providing more writing space is to make things easier for users who publish using mobile devices, like smartphones and tablets.

3. Quickly switch between visual and text editor

The editor will now feature a dropdown for shifting between visual editing mode and text editing mode. This will make the switching quicker and seamless.

4. Preview HTML code

This feature is targeted for designers and developers. They can now preview the HTML code within the text editor itself. There will be no need for them to switch to visual mode to check their HTML code in work.

5. Easily assemble themes

For assembling a WordPress theme in current editor, you need to have a little technical knowledge of web development. But that has changed in Gutenberg. The blocks approach in the new editor is making it easier for even non-tech people to assemble themes.

6. Improvements to WordPress Rest API

For developers, it will now be easier to use WordPress as a framework for building applications. It has become possible because of the improved Rest API in the WordPress 5.0

7. Impact on current WordPress themes and plugins

Since, there are new features and functionalities in Gutenberg editor, the existing WordPress themes and plugins will have some impact. These themes are best suitable for the TinyMCE editor, but Gutenberg will need developers to work on their themes and plugins. They will either need to update or create new ones to complement the new editor.

8. Twenty Nineteen theme

WordPress is shipping the minimal Twenty Nineteen theme with the latest version that will support the new editor on both front-end and back-end.

9. New visuals

Gutenberg editor also includes a number of new visual styles and options for Cover Text. There is a customized color palette that can be used to update font size, drop cap the fonts, change text color, and background color.

10. Table of content on sidebar

If you are a blogger or author, then this feature is really very useful for you. There is Table of Contents option on the sidebar that includes clickable links to headings in the article. This will save a lot of time for bloggers who write lengthy content. You can now jump directly to a heading just by clicking the link, rather than searching for the paragraph.

11. Information popup

In the TinyMCE editor, you are used to check the number of words at the bottom of page. This has changed in the new WordPress editor. There will be a small information popup in the sidebar that will not only display the number of words, but also the number of blocks and headings in the draft.

How to go Gutenberg?

With the official release of WordPress 5.0 in December 2018, the Gutenberg is now generally available. If you want to use it in place of current editor, then you will need to update your website to WordPress 5.0 and later versions.

For some reason, if you want to switch back to the previous editor, then WordPress allows you to do that.

WordPress 5.0 is the most important update of WordPress since the release of the CMS. The platform is powering around one-third of the total websites on internet and that’s the reason behind Gutenberg being the talk of the town.

Update your site to latest WordPress version to see how things work for you. If you are already using the Gutenberg, please share your experience with us.

Our Products

Quick Info

Our Other Products

follow us

A cookie is a piece of information that a website stores on a visitor’s computer. We use this for some functionality on our website to work properly, collecting analytics to understand and improve a visitor’s experience, and for personalized advertising. You can accept all cookies at once or fine-tune your preferences in the cookie settings. Cookie Policy