Designed with flexibility at its core, it allows you to show off your services or products with a combination of columns, groups, and media blocks.
Set your content to wide or full alignment for dynamic and engaging layouts. Or even let your thoughts be the star with a centered-content column!
About six months ago, in WordPress 5.0, the Gutenberg Block Editor saw the immediate replacement. Especially to the previous WordPress Classic Content Editor Version. Since then, several of our subscribed readers have asked us to create this Comprehensive Blog Article.
As of today, the new WordPress 5.3 Update expands and refines the block editor introduced in WordPress 5.0. With a new block, more intuitive interactions, and improved accessibility. New features in the editor increase design freedoms, provide additional layout options and style variations.
How is the Classic & Block Editor different?
In WordPress 5.0, the classic content editor was replaced with a brand new block editor, known as Gutenberg. Since then, several of our readers have asked us to create a comprehensive tutorial on how to use the Gutenberg block editor in WordPress.
The WordPress block editor is a totally new and different way of creating content in WordPress. In this tutorial, we will show you how to use the new WordPress block editor and master it to create visually stunning blog posts and pages.
Therefore, if not comfortable with the new Gutenberg Block Editor, always remember that; you can run back to the WordPress Classic Editor. Whereby, the Classic Editor plugin restores the previous WordPress editor and the Edit Post screen.
Unlike the Block Editor, the Classic Editor lets you;
- To keep using plugins that extend it,
- Keeps old-style meta boxes, and eventually,
- it allows you to continue using functionality. Otherwise dependent on the legacy editing experience.
In addition, the Classic Editor plugin includes several filters that let other plugins control the settings, and the editor choice per post and per post type.
By default, this plugin hides all functionality available in the new Block Editor (“Gutenberg”). Please learn more about the WordPress Classic Editor Features.
For WordPress Developers and Block Editor Users, kindly follow the links below for more understanding. Including,
- WordPress 5.0 Development Field Guide
- Meta Box Compatibility Flags
- Block Editor Filters
- The REST API in WordPress 5.0
- Media 5.0 Guide
- Block Editor Support in Existing Default Themes
How is the Block Editor useful to Developers?
Always remember that; some big changes have come to the editing experience in WordPress. For instance, a new block-based editor is the first step toward.
For example, with an exciting new future that has a streamlined editing experience site-wide.
In the first place, the new Gutenberg Block Editor is more flexible with how content is displayed. In addition to inserting any type of multimedia and have it embed automatically.
Secondly, each piece of content is in its own block and easily maneuverable with a mouse or keyboard. Further, with tons of blocks available by default with more to come. Including;
- preformatted text,
- cover image,
- columns with nested blocks,
- and more!
Important to realize that; the release of WordPress Version 5.0 brought forward the Twenty Nineteen Theme.
Of course, a new default WordPress theme too, and that shows off the power of the new editor. Such as;
What are the Benefits of Block Editor?
Although this may be true, the new WordPress block editor offers a simple way to add different types of content to your posts and pages. For example, previously if you wanted to add a table in your content, then you needed a separate table plugin.
With the new editor, you can simply add a table block, select your columns and rows, and start adding content. Equally important, you can move content elements up and down, edit them as individual blocks, and easily create media-rich content.
Most importantly, the new WordPress block editor is easy to use and learn two. In reality, this gives an immense advantage to all WordPress beginners who are just starting their first blog or building a DIY business website.
How do you Install WordPress Gutenberg Plugin?
As of writing this, the Gutenberg plugin currently has a little over 20,000 active installs with over 290,000 total downloads and a 2.5 out of 5-star rating.
Moreover as of the time of this publication, with last updates being 3 weeks ago, it also requires WordPress version 5.0 to use it.
On the contrary, the purpose of adding Gutenberg to WordPress is to offer a modern writing experience to users. Then again, it is intended to be used by everyone. Including,
- and businesses.
You can download the latest version of Gutenberg from the WordPress repository or by searching for it within your WordPress dashboard under “Add New” plugins. Again, we recommend installing this on a test site or utilize your host’s staging environment.
Here is the full Installation Guide.
Can the Block Editor be used with Builder Plugins?
Of course, Yes! Chiefly, Page builder plugins provide a visual drag and drop interface to design entire pages. To enumerate, SiteOrigin Page Builder Panel is the most popular page creation plugin for WordPress.
Not forgetting that; it makes it easy to create responsive column based content, using the widgets you know and love. Your content will accurately adapt to all mobile devices, ensuring your site is mobile-ready. Read more on SiteOrigin.
After installing Gutenberg, you will see links under your Posts that allow you to open up the Gutenberg editor. They don’t replace the default WordPress editor, which is a good thing in our opinion, as during the testing phase it allows you to bounce back and forth.
Why is the new WordPress 5.3 update useful?
The scope for this release is consistent with the 2019 objective of Matt Mullenweg to tighten the CMS. In order to enhance current features and functionality.
In addition, the main improvements that could be included in the upcoming updates are elements such as;
- Grouping: support for dividing your page into a section
- Motion: support for visual motion when moving/arranging blocks
- Column patterns and widths: support for fixed column widths, and predefined layouts
- Big images: support for saving progress after a big image fails to upload
- Media accessibility: some fixes and a lot of polish as a result of the a11y audit
- PHP 7.4: support for the new version coming late in November
- And also: Build/Test updates, better administration of emails, and a lot of under the hood improvements
As you can see, they are two completely different editors for creating content in WordPress. Again, the old WordPress classic editor was a text editor with formatting buttons very similar to Microsoft Word.
Uniquely, the new Block Editor (Gutenberg) uses a totally different approach, called ‘Blocks’ (hence, the name Block Editor). Identically, blocks are content elements that you add to the edit screen to create content layouts.
In the light of each item, you add to your post or page is a block. As an example, you can add blocks for each paragraph, images, videos, galleries, audio, lists, and more. There are blocks for all common content elements and more can be added by WordPress plugins.
I hope the above-revised guide was helpful towards your WordPress editing strategy.
However, if you’ll have additional Contributions, Suggestions, Support Guides, Personal Experiences or even further Questions, please Contact Us.
Furthermore, your Generous Donations will be highly appreciated. In regards to this topic, consider the links provided below as useful and related too.
- Content Design and Development Guides
- WordPress Sites Builder » Themes & Plugins
- Wix Websites Builder » Create Sites Your Way!
- WordPress Sites Builder » Themes & Plugins
- Website Design From Scratch: Step By Step