Please use the “Print” function at the bottom of the page to create a PDF.
With the Gutenberg editor introduced in WordPress 5, creating articles and pages becomes more flexible: You can design articles even more easily using movable blocks. In this article, we'll show you how to use the Gutenberg editor.
Activating Gutenberg
The Gutenberg editor is automatically activated with the update to WordPress 5.0 and replaces the regular editor. If you set up automatic WordPress updates, you do not need to do anything else.
In contrast to the usual WordPress editor, the Gutenberg editor allows you to preview and edit the entire article. The article itself is built using practical content elements, the so-called "blocks". For each part of content, there is its own content element with a block, which you can fill and design individually, with text, images, lists, covers, headlines, quotes and more. You can easily move any of these blocks at any time and thus easily loosen up and structure the text.
Creating a New Post or Page
As usual, after logging in to your WordPress dashboard, click on Posts > Add new.
By default, the first block for the title of the article already appears. You can edit this in the Add title field. To start the article text, you need to add a block - you can do this by clicking the plus icon above the editor. The Gutenberg editor now offers you the most common blocks under Most used: Paragraph, Image, Headline, Gallery, List, and Quote.
If you click Browse All, more content elements are available, such as Code, Classic, HTML, Preformatted, Table, etc.
Under Design, you will find the blocks Button, Columns, Group, Row, Stack, More, Page Break, Separator as well as Spacer.
Under Widgets, you can choose among Shortcode, Archives, Categories, Recent Comments, Recent Posts, and more.
If you want to embed content from other services, you can find the blocks Embed, Twitter, YouTube, Facebook, Instagram, WordPress, Soundcloud, Spotify, Flickr, Vimeo and numerous more under Embeds.
Writing Text
For a classic article text, select the Paragraph block under Most used or Text blocks. Here you can either write normally or insert an already written text. The line break is automatic.
Please note: As soon as you insert a new paragraph in this block by pressing the Enter key, a new block opens for the paragraph in question. So the more often you provide a paragraph in the text, the more paragraph blocks you will get.
For each paragraph, you can specify a font size and use color settings to specify the background color and text color individually.
If you are an experienced user, you can also use an Additional CSS class per paragraph via Advanced.
Inserting Images or Other Content
To insert other content into the text, select the appropriate block after clicking the plus icon for Add Block. You can upload an image in the corresponding input mask, insert one from the media library of your WordPress blog (if available), or also Insert From URL if your image is hosted elsewhere.
Moving Blocks
If you want to move a block within your article, simply click on it. Now you can click on the Move up/Move down arrows to move the block one place up or down. Alternatively, you can drag it to the desired position by holding down the mouse button on the drag icon (dotted lines).
Editor Styles
Visual Editor is preset by default: With what's known as a WYSIWYG editor (What you see is what you get), you don't need to worry about code. If you want to switch to the Code Editor and from there switch back to the Visual Editor, click on the three dots in the upper-right corner. Then, select the desired editor under Editor.
Saving Drafts and Publishing
If you do not want to publish your article yet but save it for later editing, click on the Save draft link in the top bar. This will allow you to return to the article at any time and edit it further or set it aside for later publication.
If you click the Publish button in the top row, your article will become visible on your blog.