Recently, I helped a client upgrade from an older (and malfunctioning) WordPress installation to the newest version of WordPress that uses the Gutenberg WordPress Editor.
It was a step she had been meaning to do for a while, since editing her existing site had become a headache.
And her website was suffering for it. It failed speed tests on the most important pages and editing content was not something she could easily hand over to staff.
Unfortunately, there are many other small business owners in a similar situation.
Making an upgrade without understanding the implications to your business is risky.
In this post, I’ll show you what you need to know about the newest version of WordPress, how the new Gutenberg WordPress Editor works and what advantages it gives you for your online business.
Table of Contents
- What is the Gutenberg WordPress Editor?
- Which Gutenberg WordPress Editor are we talking about here?
- What is the WordPress Classic Editor?
- Gutenberg WordPress Editor vs. the Classic Editor
- The Classic Editor (TinyMCE) Experience
- TinyMCE = Tiny Annoying Bugs
- A Fragile Ecosystem of Plugins, Premium Themes and Page Builders
- The Classic Editor: Confusing for End Users
- WordPress for the 21st Century!
- Time-saving Gutenberg Block Editor features
- Is giving website authors more control a bad idea?
- Page Builders, Theme Builders and Developers Are Already Adapting to the New Ecosystem
- But What About Legacy WordPress Websites that Need Further Support?
- In Conclusion: Should You Use the Gutenberg WordPress Editor for your Business?
What is the Gutenberg WordPress Editor?
Simply put, the Gutenberg WordPress Editor is a site editing interface that makes creating and editing content much more intuitive.
WordPress wanted to offer website owners the ability to create and edit their content in a more direct way – and compete with the page builders and premium themes that had emerged because the Classic Editor experience was lacking in that regard.
While many WordPress developers and theme designers were upset with WordPress for suddenly changing the rules, the goals of the Gutenberg WordPress Editor project make a lot of sense:
- Give WordPress authors more control over their website content layout and design
- Free us all from the shackles of premium themes that promise much, but deliver an experience that leaves you locked into a certain set of features
- Eliminate the bloat of site-editing plugins and themes
- Eventually move to full-site editing for WordPress (2021)
I’m all for the changes that WordPress is bringing about with their Gutenberg WordPress Editor.
But, to be fair, there have been some issues with the Gutenberg WordPress Editor and how it was rolled out that have impacted users and developers.
We’ll get into some of that below.
Which Gutenberg WordPress Editor are we talking about here?
When I first started researching Gutenberg, I realized that critics of the new WordPress Editor were sometimes talking about two different things. When WordPress launched the new feature, they called it “Gutenberg” and sometimes just the “Block Editor” and now “the WordPress Editor.”
When you search for Gutenberg WordPress Editor, you may see that there are two things people are referring to:
- The WordPress (Block) Editor: the editing UI that’s baked into WordPress version 5.0 and above
- The Gutenberg Plugin: a plugin that allows developers to test and implement the latest beta features in development (see below)
Look at those plugin reviews! Gah! Many developers and WordPress users took out their frustrations on WordPress by leaving nasty reviews. You can get a sense of who was impacted the most by the changes brought about by WordPress by browsing through the reviews.
As there’s nowhere to leave a bad review of the Block Editor, everyone jumped on the poor old Gutenberg plugin.
But the Gutenberg plugin is a beta-testing plugin for new WordPress editor features. It is updated every couple of weeks with new tools and enhancements.
The WordPress core software, which features the (Gutenberg) WordPress Editor, usually releases updates every 3-4 months and these updates include security, general WordPress improvements, and also new Block features.
If you’re just starting to use WordPress or doing a major overhaul of your existing website, you’ll probably wonder what all the fuss was about.
What is the WordPress Classic Editor?
In my old business, I struggled with the Classic editor on a daily basis.
In a nutshell, what you wrote in your Classic editor interface was not what you would see on the public-facing side of your website – and sometimes there were persistent bugs that made simple edits tedious.
Before I learned how to code, I would need to resort to using plugins (some paid) to achieve the layouts and designs I wanted.
And once I did use a page builder to create a whole new website and was less than thrilled by the experience.
Gutenberg WordPress Editor vs. the Classic Editor
In 2021, at least 11.6% of all WordPress installations are using a pre-Gutenberg version of WordPress. That means of the estimated 64 million website using WordPress, approximately 7.4 million have not updated to the newest version.
And, up to 5 million have installed the Class Editor plugin in the last couple of years and there is a loud and fervent support for maintaining its functionality.
This brings up some key questions:
- If you have a WordPress website already, should you update to the newest version?
- If you’re new to WordPress, does it matter which one you use?
- Is this a Coke vs. New Coke thing?
Never fear, dear reader, we’ll cover all of that in due course below. But first, a trip down memory lane.
The Classic Editor (TinyMCE) Experience
If you’re a retro WordPress hipster (or need TinyMCE for custom post type magic), you can use a Classic editor plugin to recreate the good old days as you listen to Pink Floyd’s the Wall on original vinyl.
Here’s a sample page draft with the Classic editor.
(*we don’t need no education…*)
(* we don’t need no… thought control *)
And here’s what we get on the front end:
Okay, not so bad, but what about using all the features we come to expect from a modern website?
Features like:
- columns
- sections
- background images
- background colours
- buttons
- full width content
- custom groups (image, text, button components)
- cover elements (image + text overlay)
As you’ll notice, none of these options are available in the Classic Editor UI.
TinyMCE = Tiny Annoying Bugs
And there were many small bugs with the Classic editor that made making edits frustrating. Like weird problems with line spacing and extra hidden encoding that explodes on the page when you copy and paste from a Google Docs or Microsoft Word file.
One of the worst bugs was trying to insert custom code into the Text editor option and then losing all formatting when you switch back to the Visual Editor.
A Fragile Ecosystem of Plugins, Premium Themes and Page Builders
I can understand that thousands of websites and developers had built websites using a whole ecosystem of themes, plugins and workflows on top of the Classic Editor, not to mention numerous optimizations.
Some pretty amazing websites have been built with this approach.
I’ve also seen the downside, too. The limitations of the Classic Editor made necessary a hodgepodge of content editing solutions that made for slower sites and poor admin experiences for site authors.
The biggest drawback, by far, was the dependence on multiple plugins for displaying website content.
It’s no wonder that page builders like Elementor, Beaver Builder, and Divi found a market for their drag and drop site editing experience.
The Classic Editor: Confusing for End Users
The limitations of the Classic WordPress editor meant that WordPress developers had to resort to unholy deals with the devil to make their content look spiffy on the public facing “front end” of their websites.
For example, I helped a client upgrade their site from the old version of WordPress. Their old site relied on 6 different plugins to display content in addition to extensive use of widget areas and page templates:
- A page builder for layouts
- a plugin for media gallery
- a plugin for embedded videos
- a plugin for smaller on-page elements
- a plugin for header content
- a plugin for sidebars
- a plugin for custom elements (ACF Pro)
- extensive use of the WordPress Customizer
- some few hard-coded page templates
While the site looked reasonably good on the front-end, it was easily broken by non-developer site editors trying to update content.
I don’t think the developer truly appreciated the hassle and confusion that this kind of set-up created for my client.
At first, I was hired to fix bugs and make simple updates to content because my client couldn’t figure out where to make edits across the website without breaking things.
This set-up cost my client time and money, plain and simple.
By the time I got involved, several of those plugins were no longer supported and already causing new visual bugs with every WordPress update.
Given the need to come up with some pretty convoluted solutions, I can see why WordPress theme developers and power users were up at arms when Gutenberg WordPress Editor came out. It’s because they had been hacking WordPress for years and were afraid that all their work would be undone.
And perhaps they feared that their clients would no longer need them – although I think that’s an unfounded fear that misses the point of what WordPress developers actually should be doing for clients.
Change is necessary. Especially when it benefits business owners by giving you the advantage of speed, flexibility and lower costs.
WordPress for the 21st Century!
In the Gutenberg WordPress Editor, adding or editing content is pretty straightforward for anyone who has used software and web apps in the last 5 years.
When you want to add a paragraph, heading, image or anything else, you just type in a block name or click on the helpful blue plus sign [+] at the top to search through most common blocks. Insert into the blank page and start building and editing: Block
This example is a block pattern that consists of the following blocks:
- Image
- Heading
- Paragraph
- Button
These blocks are wrapped in a 3-column block.
And here is what it looks like on the front end:
It’s pretty much the same!
WordPress is adding more blocks with each update. And there are also new Gutenberg WordPress Editor Libraries available as plugins. You can try extensive libraries or find solutions that target just the type of block you need.
So what’s the main benefit to you so far?
Editing makes way more sense with the Gutenberg WordPress Editor and you can quickly build pages and layouts with blocks.
See below for more time-saving features.
Time-saving Gutenberg Block Editor features
According to many expert WordPress developers who have embraced the Gutenberg WordPress Editor and have bet their agency’s success on adopting it full stop, using Gutenberg helps developers create performant WordPress websites in less time, create consistent branding experiences for site authors and editors, and helps businesses avoid being locked into a premium theme, page builder plugin or 3rd party ecosystem.
The advantages allow business owners to make major site changes, redesigns or improve functionality faster and with less cost.
You can also put your web development budget toward website enhancements that go beyond design, layout and styles, such as:
- content creation
- conversion rate optimization
- SEO optimization
- displaying data dynamically
- user experience
- accessibility
- site speed optimization
- eCommerce customization
- creating a personalized experience for visitors and customers
Here are some features that your WordPress developer should use to help you get to that point sooner.
Content Marketing is much easier now
It is really easy to start adding content with blocks. You don’t need much in the way of staff training to show someone how to use the Gutenberg WordPress Editor to add, edit or create whole new types of content on WordPress.
There are tons of helpful YouTube videos on how to get started.
You can focus more on research, SEO, and writing and less on messing around with the interface.
Use Reusable Blocks for repeated elements
You can now easily create a block template that you can reuse throughout the whole site. This can be something that is pre-formatted or a grouping of blocks saved as one Reusable Block.
And if you need to make small adjustments to a certain Reusable block on a given page or post, you can edit it as a single instance (aka local copy) of that block.
This is great for info cards, special sections with inner blocks, page content layouts and more.
Block Patterns
In the old days, with the Classic Editor, page layout patterns were usually done with PHP page templates or a page builder plugin. Layout patterns for on-page content, such as a product or recipe card, needed extra plugins such as Advanced Custom Fields (ACF) to achieve that kind of control.
It took considerable time and money to set up these layouts so that site authors could actually edit them or see dynamic data displayed on a page.
But with the WordPress Editor it’s much easier for a developer to use preset block patterns to define different page types and page content layouts.
Fully Custom Blocks (with PHP or React)
Developers can build custom blocks in PHP with plugins or from scratch with React/JavaScript. These options make it easier to make blocks specific to a client’s needs.
Custom block plugins are beginning to appear now to give users that option, too.
Headers, Footers, Navigation and Landing Pages (Full Site editing)
WordPress is planning to release a new update of the Block Editor in either July 2021 or December 2021 which will include the following capabilities for the Block Editor:
- Edit Headers and Footers
- Edit Site Navigation
- Create Full Landing pages
- Query Block (so you can filter content)
- Page template editor
- and much more
These features have been tested and release in the Gutenberg plugin over the last few months (prior to June 2021).
It appears that many of the extra functions will be opt-in for now, meaning that the WordPress theme you’re using will have to explicitly enable these features when they are released with the next update of WordPress core.
Is Giving Website Authors More Control a Bad Idea?
One of the big arguments against giving website owners more power to edit their sites was that custom themes were useful because they could more easily keep the design “on brand.”
You don’t want a junior admin assistant messing around with colorful fonts or adding things to your website that just don’t fit. Or this might happen:
Yes, in the Gutenberg WordPress Editor, you can easily add styles or elements that don’t match your website’s design or brand. And yes, that could be messy if not managed properly.
And, also, with the Gutenberg WordPress Editor, a WordPress developer can quickly develop page layouts, styles and options that can be limited or locked down to prevent such crazy forays into the unknown abyss of unlimited power (see above).
In fact, you could say that the job of a good web design has always been to limit choices for their clients to make updates and content creation fast and efficient.
Now, a WordPress developer can create and customize block patterns while controlling the colour palettes, layouts, styles, while still making new types of content easy to add.
And users cans still make smaller changes on the fly.
So it’s the best of both worlds.
Page Builders, Theme Builders and Developers Are Already Adapting to the New Ecosystem
Some heavy hitters in the WordPress space are recognizing that WordPress is moving toward giving site owners full site editing capabilities.
Genesis Themes recently announced they would make their framework theme free and that they were retiring all but ten of their most popular themes to focus on making the most of Gutenberg WordPress Editor full-site editing.
Many new companies and plugins offering extensive Block Libraries have sprung up in the last few years.
The layout problems that used to require custom coding to solve and now being eliminated one by one as WordPress developers turn their attention to making the best of the Gutenberg era.
But What About Legacy WordPress Websites that Need Further Support?
If you have a WordPress website that relies on the Classic Editor and lots of plugins to function, you should know that not biting the bullet to update it to the latest version of WordPress will come at a cost.
Here’s how your legacy website may be compromised in the future:
- Older versions of WordPress are vulnerable to hacking
- Older version of WordPress slower: new versions make use of significant improvements in PHP
- Classic Editor plugin support will end on December 31, 2021.
- Some companies are dropping support for the old way of building themes and plugins (i.e. Genesis Themes)
The good news is that the Gutenberg WordPress Editor features are mostly backwards compatible with older well-built WordPress themes. And you can still use widgets, short codes, plugins and custom PHP code to your heart’s desire.
In Conclusion: Should You Use the Gutenberg WordPress Editor for your Business?
I highly recommend using the latest version of WordPress for most businesses.
Here are the major benefits:
- Exciting changes and improvements are coming at a rapid pace allowing for lightweight websites
- Gutenberg solves many layout and design problems without the need for plugins
- It is much easier for site authors to update content
- Development time and cost may be greatly reduced
- Plugin testing, debugging and maintenance should be reduced significantly
- You can devote more resources to the custom website features that really matter to your business
- You are not locked into a paid plugin for your site’s front end design
- You can easily make changes to your design and content at any time
Here are some drawbacks to be aware of as you consider your own situation:
- Converting a plugin-heavy site to Gutenberg may have pitfalls and may require a full redesign
- Migrating custom layouts made with page builder plugins to Gutenberg may have limitations
- Page builders are known to have had compatibility issues with Gutenberg if you plan to use one going forward
- Some plugins may no longer work with the newest versions of WordPress
On the whole, if you’re considering a site redesign or starting from scratch with WordPress, I’d highly recommend you get a WordPress theme built to take full advantage of the Gutenberg WordPress Editor.
And if you have a large website with lots of moving parts, you’ll need a detailed, step-by-step plan for how make the conversion, including risks and whether you’ll be able to find solutions to your must-haves that were built the old way.
WordPress is evolving into an even better tool for online businesses. Have any questions about topics I covered or didn’t get to in this article? Let me know below in the comments.