This post is Tutorial 3 in the Gutenberg 101 series.
The post and page settings in Gutenberg have changed extensively. They are much more streamlined and appear more modern looking. No longer do you have separate sections on the right side and bottom of the post content area. The settings are now in a menu format to the right of the editor with the ability to move it out of the way if needed by simply clicking on the gear icon. This allows you to focus more on writing.
The top portion of the settings menu has two tabs – Document and Block. These tabs let you easily switch between settings. The Document tab allows you to edit and set options for the post or page such as category, featured image, scheduled date, etc. The Block tab allows you to edit and set options for each individual block you use such as image, paragraph, and lists.
Document Tab Settings
Status and Visibility – The settings for scheduling a post, setting the post or page status to draft, pending, or published, the post format, who can see the post or page, and the option to make a post stay on the front page are found here. If there is more than one author account on your WordPress install, the ability to change post author is here too.
Categories – Set or assign a new category for the post.
Tags – Assign tags for the post.
Featured Image – Assign the featured image for the post.
Excerpt – Write the excerpt for the post.
Discussion – Set your comments options.
Block Tab Settings
The settings available for each block will vary with each block. The most common block settings are listed below for your review:
Paragraph – You can easily set the text size, format the text with a drop cap, change the paragraph background and text color, and add additional css selectors.
Image – Set the alt text, image size, link settings, and any additional css selectors here.
Cover Image – Chose weather the the image should be in a fixed position or not and adjust the background opacity which determines the transparency of the image.
Columns – Choose the number of columns needed.
Heading – Set the heading level to H1, H2, H3, H4, H5, or H6, and the alignment of the headline.
Keep in mind when writing or editing text a bar will popup where you can perform basic formatting such as bolding, alignment, italics, and links.
Something you might notice missing is the ability to change the slug or permalink of a post or page while editing it. Don’t worry, it’s still there. Click on the title block and the option to change the permalink will appear.
The screen settings link at the top of the editor is also been removed as it is no longer needed.
The Top Toolbar
Above the editor lays a toolbar as shown in the image below that deals with the document as a whole.
Circle + Icon – Adds a block to your document.
Left Arrow Icon – Undo the step you just performed.
Right Arrow Icon – Redo the step you just performed.
Circle i Icon – When you click on this icon you get some stats on your content. It will show you the number of words, headings, paragraphs, and blocks used. Helpful information if you are attempting to meet certain writing goals.
Save Draft – If you have not previously published the post or page yet, you have the option to save it as a draft. If the post or page has already been published this option will not appear on the toolbar.
Switch to Draft Button – Allows you to unpublish a previously published post or page.
Preview – View a preview of your content in a new tab or window as if it was published.
Publish – If the post or page has not yet been published the Publish button will appear allowing you to publish the content or schedule it for later.
Update – Save any changes made to your post or page.
Gear Icon – Shows or hides the settings menu on the right side of the editor.
3 Vertical Dots – Menu that allows you to switch between the visual and HTML editor, fix the formatting toolbar to the top (bold, italics, alignment, etc.), display tips when creating a new post, and to copy all the content.
Keep learning about Gutenberg with the next tutorial in this series: Editing the HTML with Gutenberg + Keyboard Shortcuts.
