Top 3 Reasons To Use The Gutenberg WordPress Block Editor

Gutenberg Wordpress Block Editor

What is Gutenberg?

Gutenberg, which is also known as the WordPress Editor or WordPress Block Editor, is the default post and page builder on WordPress. It was launched in 2018 and is now included in all subsequent versions of WordPress, although you can still use the Classic Editor if you prefer. Gutenberg allows developers a drag and drop, block-based UI to build. It includes many of the commonly used blocks, like text, image, gallery, etc…, as well as some layout options, like columns with different width presets. The formatting options per block are limited, however, it is possible to create custom css classes and customize. 

My Experience With Gutenberg WordPress Block Editor

Recently, I’ve built a few sites using Gutenberg and the experience was good. I found that it is easy to learn, and in its more recent versions, offers most of the blocks and formatting I need. I did have to occasionally use the custom CSS class feature. That involves assigning a class to the element in Gutenberg and then using the Customize feature from the WordPress Dashboard to add custom CSS to that class. 

For example, I wanted my outlined buttons to invert colors when I hovered. The formatting options in Gutenberg didn’t give me the outlined look and hover action I was looking for, so I created a new class with that behavior. 

It is fairly easy for someone with some html and CSS experience, plus know-how when it comes to navigating WordPress, since it involves adding code to a few different areas within WordPress.

Should You Use Gutenberg WordPress Block Editor?

It depends! There are some great reasons to use Gutenberg and it has some added benefits besides the ease of build. However, there are definitely some drawbacks as well. I’ll go over both below. You might also be considering another builder, like Elementor or Divi. While I won’t discuss much about those in this article, read-on to learn if and why Gutenberg might be the right choice for your project.

gutenberg wordpress builder shrug

Top 3 Reasons To Use Gutenberg WordPress Block Editor?

1. Your site is simple.

If your website or blog won’t require a bunch of bells and whistles or advanced animation, then the Gutenberg WordPress Block Editor may be the way to go. The mechanism to add and edit blocks, like text, images, and other media is relatively user-friendly and not a huge burden to learn if you are somewhat tech-savvy. 

The Block Editor also treats layout options, like columns, as blocks that you can then place other blocks within, which feels intuitive. Columns, for example, also come with some preset widths and layouts that are helpful and make the process quick and easy. 

Here is a very minimalist site we put together for Kelakos Advisors using (an older version) of the Gutenberg WordPress Block Editor. It is text heavy with a few stand-alone and gallery images throughout to put the focus on the written content.

2. It’s easy to add-on to Gutenberg WordPress Editor. 

Gutenberg WordPress Block Editor is the default post and page editor in WordPress. As you may know, WordPress’s model is to provide a platform that allows other developers to build plugins to cover the full range of features that users may want on their sites. For example, you might be building a website for a restaurant that requires a menu and online ordering and payment. There are plugins for that! You might be building a website for a therapist or other consultant that requires scheduling and booking appointments. There’s a plugin for that! 

Being the WordPress default post and page builder, Gutenberg’s simplicity makes it easy to incorporate these plugins into your site. Whether you need to use a shortcode block or even have a completely separate page added by the plugin, you’ll find compatabilty and styling will generally not be an issue with Gutenberg. Some of the other builder options, like Elementor or Divi can have some complexities when using plugins. 

We used Gutenberg for Laida’s Kitchen restaurant website, which includes the Restropress menu and ordering system.

3. Gutenberg WordPress Block Editor is lightweight.

One major challenge using any WordPress Block Editor plugin is all of the extra code loading required behind the scenes to serve your site. Builders like Elementor and Divi require a ton of extra resources to be loaded with your posts and pages, which has a devastating effect on your site’s Core Web Vitals. These are the metrics Google uses to rate different aspects of your site, one of which is Performance. 

The additional load time from these builders drops your Performance rating significantly, which can not only impact the user experience, but also your page rankings on Google. However, Gutenberg is a very lightweight builder. In the trade, for giving up fancy animation and more advanced customization options, Gutenberg uses significantly less resources, improving your page’s performance.  

Conclusion

There is no one-size-fits-all solution when it comes to selecting which builder to use for your WordPress website or blog project. The default Gutenberg WordPress Block Editor offers some benefits over more heavy-duty builders like Elementor and Divi, but requires some sacrifices as well. It is worth mentioning that there are plugins available that offer more advanced blocks specifically for Gutenberg, such as Gutenberg Blocks. Additionally, some popular plugin developers have created their custom blocks and tools specifically for Gutenberg (along with their offerings for Elementor, for example), like Crocoblock.

I would recommend keeping the Gutenberg WordPress Block Editor in mind as a simple, lightweight option when you research and consider your builder selection, like Elementor, Divi, and any others you discover. Be sure to factor in your SEO strategy, the requirements of your content specifically, as well as your coding ability and WordPress familiarity for customizing purposes. 

And Remember...

If low-cost, managed development might be a good option for your website or app project, contact XBit Technology using this form. We're happy to help!

Leave a Reply

Your email address will not be published. Required fields are marked *