What is the WordPress Gutenberg editor?
You may have heard of the WordPress block editor, a tool for creating content released in 2018. Historically, the WordPress content editor has been very simple, and it’s been the responsibility of website developers to solve more complex content creation needs as they see fit. As a result, many different ways to create sites emerged, along with various tools and plugins. But that changed when the new block editor was introduced.
The basics of the block editor
As the name suggests content is built up from different blocks in the block editor. Today, web pages are no longer just text. Content often consists of images, headlines, different layouts, and videos. The block editor meets this need by allowing you to create even complex layouts without needing fixed page templates or coding. Our clients see the biggest benefit of the block editor as the flexibility to create different content quickly and easily on their own.
Gutenberg also has the advantage of displaying a preview of the page directly in the editor. This way, when creating content, you can see exactly what the page will look like.
The image below shows the view of the content provider. At first glance, this image shows a fairly standard article view, but the content in question is actually made up of separate blocks: a header block, a text column block, and an image block.
The benefits of the editor may not yet be clear in this example, but the next picture shows a more complex page layout. This example consists of an image and text block with a column block below it, headings, text, and buttons.
The blocks have many different settings and possibilities to influence the layout. You can use the settings to influence the layout, margins, colour and typography of the blocks. Below is an example of a cover page block setting that can be used to influence the colour scheme and margins.
The Gutenberg editor in WordPress comes with several default blocks:
- Text paragraph: the most typical way of presenting and formatting text.
- Image: for adding and editing image files.
- Title: for creating headings (H1-H6).
- List: for adding ordered and unordered lists.
- Quote: To highlight quotations.
- Gallery: for displaying multiple images in a grid.
- Button: a button that links to the desired page
- Embed: for embedding external content (e.g. YouTube videos, Instagram updates).
- Columns: for splitting content into multiple columns.
- Subheading: for separating parts of the text with a subheading.
- Media & Text: for displaying media content (e.g. images, videos) and text side by side.
Block groups
Building pages block by block from start to finish gives you a lot of freedom, but it’s also a lot of work. A typical website usually consists of about a dozen or more layouts that are repeated from page to page. There is a certain kind of cover page, a few ways to list articles, service elements, product listings, and so on. So block groups are one of the key features of the WordPress Gutenberg editor alone. Once you’ve built a nice multi-block entity, you can save it as a block group (pattern). This group can then be quickly dropped anywhere on the site and also quickly edited to suit your needs.
The effective use of block groups is one of the most important things to familiarize yourself with. With ready-made groups, you can create, for example, a new campaign page with just a few clicks.
Scalability
The great thing about WordPress has always been its scalability – and the same goes for the block editor. Site administrators don’t have to settle for a predefined set of blocks, but can freely build more. However, this requires knowledge of WordPress and programming skills. Creating new project-specific blocks is therefore an essential part of the work we do for our clients. Such blocks can be, for example, various listings, questionnaires, forms and so on.
In summary
The block editor is WordPress’ answer to the changing content production needs. Many of our clients have not been happy with the content creation tools of the previous publishing systems, which have often been perceived as rigid and limited. The Gutenberg editor solves this challenge and frees up time from wrestling with tools to more valuable marketing work.
