Learn Gutenberg 1 – What is Gutenberg?

The latest WordPress update, the possibility of testing the new editor. The final step for Gutenberg is for it to be included in the WordPress core and completely replace the current editor, which we will refer to as the “classic editor”. Gutenberg will be fully implemented in the core when WordPress reaches its version 5.0.

Gutenberg seeks to modernize the way we have today of editing pages and posts in WordPress, making the layout of our posts and pages is more visual and resembling it to what we will see later on the web. 

What is Gutenberg?

Gutenberg is a content editor that allows us, through blocks, go laying out the entries and pages more visually.

Gutenberg makes it easy for the user to create more visual pages and posts, even without having to know HTML or CSS, since from the same editor and thanks to the blocks we will be able to easily layout.

What are blocks in Gutenberg?

With the entry of Gutenberg, the concept of «block«. Hereinafter all contents of our pages and our entries will be encapsulated in blocks. We have blocks of all kinds: paragraph blocks, header blocks, image blocks, list blocks, etc.

This opens up a world of possibilities, developers can programming new blocks as plugins that will be added to our Gutenberg. We will talk more about this topic in future articles.

What happens to my old content?

You may wonder what happens to your content that was made with the classic editor.

No need to worry, Gutenberg will include all content within a “classic editor” block, so it will change its shape before installing the new editor.

Classic editor possibility

Currently, Gutenberg brings us the possibility of being able to choose which editor to use in a page/post, if the classic editor or the Gutenberg editor.

Similarly with a entry/page already created, we can choose which editor to use.

How to start in Gutenberg?

Once we have already installed it, when we enter a post or page with the new editor, we will see something similar to the following image.

The basics do not change from one editor to another, what changes are the shapes. We will have to add a title that will be placed as slug. Right under the title, what I have called "Body of the entry", is where we will find the layout of our entrance with their corresponding blocks.

At the top left we will always have the «Add block«, which will display the list with all the blocks that we have installed. We also have the “Undo” and “Redo” buttons, as well as the “Content Structure” button that will show us information about the article in question (words, headings, paragraphs, etc.).

Each paragraph in Gutenberg corresponds to an independent block. If we want to add a paragraph between two already created, we will only have to press the button «+» that appears on each block to Create a new one. By default it will be a "paragraph block", but we can change it to any other by clicking on the "+» that appears to the left of the new block.

For move a block, either raise it or lower it from its current position with respect to the rest of the block, we will only have to press the buttons that appear to its left when we stand on a block.

If we press the options that appear to the left of the block, a tab will be displayed with a small option list.

In the sidebar on the right we will find the information that we found in the sidebar of the classic editor, but with the peculiarity that we find the options of the block that we have selected.

The settings of each block will be found in the sidebar on the right in the option «Block«.

As we have seen, Gutenberg brings us great changes, and less and less until it is fully included in WordPress. Little by little, we will bring articles related to Gutenberg, both focused on its use and development with it.

It is now available Learn Gutenberg 2 – Type of blocks.