The WordPress ‘Block editor’ (known within the WP community as ‘Gutenberg’) has been around since the launch of WP v5 in January 2019. It’s fair to say that it divided opinion at the time, with many developers feeling like it was being released before the bugs were ironed out, and whilst the user interface was still too confusing.
Almost two years later, the block editor is still under constant development and definitely not without its frustrations amongst WP developers and users. But despite that, it’s still better than the ‘Classic editor’ that has remained pretty much unchanged since WordPress launched years ago.
We use it for all our new website builds, and have started using it for every page – including homepages that traditionally were designed with a custom template that clients couldn’t break – but they didn’t have the freedom to adapt them either.
Background to the Block editor
The blocks editor was designed to keep WordPress relevant and competitive with CMS services like Medium or Squarespace that give you more flexibility in terms of design, and are much more WYSIWYG (What You See Is What You Get) content creating experiences.
In contrast, the Classic editor was good for adding titles, paragraphs of text and basic images into a page, but for anything more complicated than that you had to rely on non-user-friendly shortcodes – or a page builder plugin/theme like Divi or Elementor. Even something as seemingly simple as adding a button to a content page required some custom theme coding or a plugin that provides button shortcodes.
The Block editor works by providing the user with a menu of content blocks that they can drag and drop into place on the page. It opens up a whole world of design opportunities. WordPress itself ships with a limited set of content blocks, and there are plugins that provide you access with lots more. And you can create your own ones – which we do for example to build donation prompts or ‘featured publication’ blocks.
Downsides to the Block editor
The hugely increased flexibility and options available in the Block editor come at the cost of added complexity and potential confusion. With the old editor all you could easily do was to add text and pictures – yet in many cases that was all you needed to do. Adding a blog post or a latest news item for example, was simple because 99% of the time you just wanted a few paragraphs and a couple of images anyway.
The Block editor definitely has a steeper learning curve, particularly for users who have become comfortable using the old system. Whilst the developers of WordPress core have been constantly refining and improving the Block editor, it’s still not as intuitive or as accessible as it could be. And that means that if you’re not careful you can mess up a page when trying to edit it – which can be an issue if it means that you’re too scared of breaking your homepage to ever change it!
The Pros and Cons of WordPress page builders
For many years, if you wanted more design flexibility around building your site then you used a ‘page builder’ like Divi, Elementor, WP Bakery etc. They’re cheap to buy and give you enormous flexibility. If you were looking to build your own WP site on a shoestring budget then they were a great option.
It is common for clients to come to us with an existing WordPress site that’s been built using a page-builder plugin and they’re looking to clean up and improve the look of their site as well as add in functionality.
Some of the disadvantages of the page builders
- Page designs can quickly look messy if you don’t really know what you’re doing
- Not easy to achieve consistency of design across different pages
- Your branding colours and fonts aren’t easily available as defaults or simple options
- The mobile view of many pages in particular, was often a mess or downright broken
- Image sizes often weren’t used properly. We took over a website for example whose homepage was over 40MB in size due to three tiny thumbnail photos being used in it – it had been set to use the original image uploaded from a camera rather than a resized version
- They add a lot of ‘bloat’ to a site – with lots of Javascript and CSS files that are often unnecessary. This slows down the loading speed of the site, which can have usability and SEO implications.
Will the Block editor mean the end of page builders?
In the short run, the page builders so still offer more functionality than the Block editor (especially when it comes to laying out complex column-based designs), but in my opinion the block editor will sooner or later make the page builder plugins and themes redundant. Up until a year ago I would have recommended that a page builder is a good way to go.
In many use cases it may still be the right tool, they have a lot of users and a big fanbase. But if you’re looking to future-proof your website for the next five years or so, then I’d be looking hard for a reason not to use the Block Editor.
What can the Block editor do that the Classic editor couldn’t?
Just using the native blocks that ship with WordPress, here’s some things I can easily do in the Block editor that would have required obscure shortcodes or custom code to do in the past.
Changing the colour and background colour of paragraphs of text.
Grouping elements together to put them onto a background.
Grouping elements together to put them onto a background.
Grouping elements together to put them onto a background.
Creating simple columns
Creating simple columns
Creating simple columns
Creating simple columns
Creating simple columns
Creating simple columns
Creating simple columns
Creating simple columns
Creating simple columns
Adding in a button like this
Clean water saves lives
Whilst you can choose any colour you like for your text and backgrounds, the colour scheme from my branding has been incorporated into the Block editor so that it’s easy to maintain consistency across the site.
And not a shortcode in sight. Here’s a screenshot of the page editing screen to show you how much a better WYSIWYG experience the Block editor is.
That barely skims the surface of what’s achievable with the Block editor. These days we build pretty much every page using it, and we create custom content blocks where the core ones provided don’t do what we need. Take a look at the Church Homeless Trust for an example of a homepage built with the Block editor.
