Please use the “Print” function at the bottom of the page to create a PDF.
Valid for all IONOS WordPress plans.
The Gutenberg editor from WordPress makes creating posts and pages more flexible: Content is easily created and designed in movable blocks. This article gives you a brief introduction to the Gutenberg editor.
What is different about the Gutenberg editor?
The Gutenberg editor is a newer editor in WordPress that has been integrated as the standard editor since version 5.0. It offers a variety of elements (blocks), such as text paragraphs, images, and videos, which can be used to create and design content. Each block has its own setting options. In addition, the Gutenberg editor also offers templates and customized blocks to create content quickly. Overall, the Gutenberg editor is a powerful editor that makes it possible to create and design content easily and flexibly. Thanks to its expandability, it can also be customized to individual requirements.
Create new post or page
After logging in to your WordPress Admin Dashboard, click on Posts > Add Post.
If this is your first time using the editor on your WordPress site, you will be provided a welcome tutorial that you can go through.
The first potential block for the article title appears with placeholder text by default. To start the article, you need to add a block. To do this, click on the plus symbol in the top right corner of the editor. A selection window will open in which you can select the desired content block, e.g. paragraph, image, heading, or list. Click Browse all to see more block types. If you move the mouse pointer over one of the selectable elements, additional information will be displayed.
Write text
For a classic article text, select the Paragraph text block. Here you can either write as normal or insert text that has already been written. The line break is automatic.
As soon as you insert a new paragraph in this block with the Enter key, a new block opens for the relevant paragraph. You can specify a font size for each paragraph, insert an initial letter and use the color settings to specify the background color and text color.
As an experienced user, you can also use an additional CSS class per paragraph via Advanced.
Insert image or other content
To insert other content into the article, click on the plus symbol and select the corresponding block. If you select Image, you can upload an image, select it from the Media Library of your WordPress installation, or insert from a URL (internet address).
Move block
To move a block within your article, click on the desired block. In the menu that appears, use the up arrow/down arrow symbol to move the block
Switch to code editor
The visual editor is active by default. To switch to the code editor (HTML code view), click on the three-dot icon in the top right-hand corner of the menu and then click on Code editor under Editor.
Save and publish
To save an article for later editing, click on Save draft in the top menu of the Gutenberg editor. You can open up the article again at a later time in the WordPress administration via Posts > All Posts and edit it further.
To publish an article, click on the Publish button in the top menu of the Gutenberg editor.