Introduction to Gutenberg
You can now use ‘Block Editing’ when developing your site on WordPress.
This is a totally different way to develop a website that previously done with the Classic Editor.
If you have used different WordPress editors such as Divi, Elementor or Thrive Architect, you are familiar with how to use a Block Editor.
The Gutenberg Block Editor is a different editing experience. It allows you to create media-rich pages and posts and to control the layout within the page or post.
- What are Blocks?
- Getting Started with the Gutenberg Block Editor.
- Frequently Asked Questions about the Gutenberg Block Editor.
What are Blocks?
Blocks are containers that you can now add almost anything inside of them. And you can format each block in its own unique way.
In the past, using the classic editor, the WordPress theme controlled the layout on your website.
Within each page or post, you could enter content, but you had limitations.
Text content could be set up with various paragraph or title settings, and you could add numbered and bulleted lists. You could center, or justify right or left.
Images could be added, set up within the text in various formats.
Otherwise to add more structured content, it would take using some type of plugin and short codes.
By using the Block editor, everything is now changed.
- You now have a collection of individual content containers that you can set up as you like.
- There is a consistent way to set up and format each block you add to your page or post.
- You can add in multiple different media or visual elements into your content.
Getting Started with the Gutenberg Block Editor
The first thing to do is to add your first block.
When adding a block, you have a variety of types to choose from, depending on what type of content you want to put inside the block.
Adding a block
Frequently Asked Questions about Gutenberg Block Editor
Why did WordPress go to the Gutenberg Block Editor
Using a Block editor allows for more on-page (or on-post) control of visual and media elements. This extends the ability of a designer to create a more robust experience for the user.
Does the Block editor allow editing posts and pages in the front-end?
No. It’s a representation of what site visitors see on the front-end of your site. However, the layout and visual experience in the editor are much closer to the way things look like on the public-facing side of your site.
How will my existing content look?
Your current content should look the same as it did before. If you edit an existing post or page in the new editor, all the content will be placed in a Classic Block, which will treat it the same way that the Classic editor did.
Why doesn’t my content look the same in the editor and on the site?
You may see some variation between your content in the editor and on the site, largely because of the way your theme displays different visual elements. Some themes will include styles to help the editor look more like the front of the site; others will not. If your theme includes a sidebar, for example, you won’t see it in the editor, which may affect the width of your content when it displays on the front of the site.
Why are some settings available on one of my sites, but not another?
Some settings in blocks — “wide” or “full-width” — need to be supported by your theme. While the same blocks will be present on different sites, the specific settings you can apply to those blocks might be a bit different based on your active theme.
Will I still be able to use the Classic editor?
To switch to the classic editor, install and activate the Classic Editor plugin in your site.
Do shortcodes still work?
Yes. The editor comes with a shortcode block, which you can use for shortcodes just like before. In the future many shortcodes will become their own blocks.
Do I need to use a particular theme for the new editor?
No. The block editor will work with all themes. However, only some themes might support specific layout features (like “wide” and “full width” content). Some blocks CSS might need small adjustments for a better display.