The WordPress Gutenberg Editor

Gutenberg, a marvel — even the name has its charm! And rightly so; one of the advantages of using WordPress is its native visual editor, which can be incredibly flexible.

If we have enough knowledge, we can achieve an unmatched pace in WordPress without losing an ounce of customisation for your website.

What is Gutenberg, the native WordPress editor?

Explained simply, Gutenberg is a "visual editor" (block editor) that allows the creation of a web page using blocks in an intuitive, graphical and straightforward way.

As you can see, I've put "visual editor" in quotes. And yes, that was intentional. This is because Gutenberg, unlike visual page builders such as Elementor or Divi, allows you to create a page without live editing.

This means that from within the editor you can't see the actual appearance of the website, but rather a representation of the blocks with their content.

Why is it called Gutenberg?

The name was chosen during the development process in honour of Johannes Gutenberg, the inventor of the printing press. This German revolutionary transformed the way knowledge was shared through the mass production of books. And well, ever since WordPress has existed, we know how web creation has multiplied.

What are Gutenberg blocks?

Blocks are a graphical representation of content that, once styles are applied, will produce the desired result on the final website. To create a page in Gutenberg we need to follow the HTML structure. This makes Gutenberg suited to web developers with more advanced knowledge and the ability to understand website structure — something only experience can give.

Is Gutenberg responsive?

Yes, WordPress's visual editor has built-in CSS styles that allow us to create a simple website without touching any code, with impeccable responsive capability.

That said, if we want to create a more complex page, we'll have no choice but to have knowledge of HTML and CSS.

Can templates be used in Gutenberg?

Of course! In fact, there are several websites and plugins that provide free templates such as: SKT templates plugin, https://gutenberghub.com/templates/

Why is it better to use Gutenberg instead of another page builder in WordPress?

This is where it gets interesting, and where I get into the detail. For you to understand why it's better to use Gutenberg than any visual page builder, we need to keep a few things in mind:

1. Speed
2. Customisation capability and clean code

Speed

If we want our website to load quickly, we need to avoid loading too many CSS, JavaScript, font files, etc. Visual page builders, naturally, want to cover as many features as possible in order to attract the widest audience. This means anyone can design a website, yes. But it also means many external files are loaded, which will slow down the website.

Customisation capability

If you have knowledge of HTML and CSS, Gutenberg will allow you to create any graphical element at levels of customisation that are unmatched in WordPress. That said, if you're looking for more advanced features such as a slider, you'll have no choice but to learn JavaScript.

And what's more, if you know WordPress's native language at an advanced level, you'll be able to select which files to load and which not to, on which page to load certain plugins, on which page to load certain CSS files, on which page a JS file, etc. Basically, this would allow us to create a very clean-coded website that would have little to envy any website built in pure code.

If you want to dive deeper into WordPress customisation, we recommend learning about the functions.php file, which lets you add advanced functionality to your site.

Conclusion

Although not quite as much as visual page builders, the Gutenberg visual editor is a very intuitive and graphical tool which, to get the most out of, requires a basic knowledge of CSS and HTML.

If what we're looking for is quality in development, a good loading speed in WordPress, a better impact on Google rankings and an optimised user experience, we won't find a better tool than WordPress's native block editor.