Gutenberg WordPress Editor: The Big Dog Verdict
Bríain likes dogs and building websites. He's the perfect fit.
WordPress – it’s safe to say – is now one of the most popular Web content management systems in the world. According to the latest figures, there are over 74 million websites running on the WordPress platform worldwide. This means that WordPress now powers about 25% of websites on the Internet. Impressive, isn’t it?
With so many website owners using the WordPress system on a daily basis, any new update to its content management system will attract attention. Which is why, for anyone who’s been following web development news lately, you’ll have noticed a flurry of articles about the latest WordPress feature: the Gutenberg editor. Designed as a replacement for the original visual editor in WordPress, the Gutenberg editor has been receiving mixed responses.
As committed WordPress aficionados here at Big Dog, we thought we’d weigh in on the debate and give a run-down of this latest update. Check it out.
What is the Gutenberg WordPress Editor?
Named after the man who first introduced mass-scale printing to Europe, the WordPress team clearly expect the Gutenberg Editor to be a game-changer for WordPress users. The Gutenberg editor has been designed to replace the visual editor currently available in WordPress. By including a whole host of new features, and creating a less cluttered and more user-friendly layout, the Gutenberg editor is intended to make it easier and more efficient for WordPress users to build and add content to their pages.
In many respects, the Gutenberg is a Visual Builder tool – similar to the Upfront builder plugin – which allows much greater flexibility and control to the user when creating pages and posts. It has been designed to allow users to quickly add and style up text; add and position media, such as images and videos; and include a variety of common features you might expect to see on a page or post, such as buttons, links, icons and so on.Now that we know what it is, let’s take a look at its main features.
Improved Writing Experience
The first important difference between the original editor and the Gutenberg is the increased space it provides for writing content. One of the big bug-bears for many people using the original editor was how small the text area seemed and how cluttered it felt amidst the overall layout. This could be particularly irritating for those writing content on their laptops or tablets. This new update is a welcome one.
Alongside the larger writing area, which is now the default layout, you can also expand this area by clicking the ‘Post Settings’ button in the right-hand corner of the screen. This will now remove the various Post Setting options and fully expand the writing area, making for an easier and less cluttered writing experience.
In order to facilitate this less cumbersome writing experience, they’ve also changed the position of many of the familiar spacing and text formatting options. These now appear when you click the ‘Insert’ button on the upper menu – thus clearing up more space for the writing section and making the overall layout feel less bogged down with buttons.
Improved Experience for Mobile Users
Another important feature is the improved user experience for mobile and tablet users. The new responsive layout makes it much easier to add a quick image, change or add some text, or format your content while on the go – via your mobile or tablet. Needless to say, this is a handy new update.
Easier Table Creation
Another significant feature is the inclusion of an easily-insertable table block in the editor. In the past, the only way to add tables to your page or post was to use a third-party plugin or to build the table with HTML. Now, however, you can quickly and easily choose to create a table block from the drop-down menu of available blocks.
Quicker and Easier Embedding of External Sites
With Gutenberg, you can now embed content from external sites much easier than before. The sheer quantity of embed options for third-party sites is impressive. Say you want to add a Twitter feed into your page, or an audio player from Soundcloud, or an Instagram gallery? In the past, with the original WordPress editor, you would have had to add the embed codes via HTML. This new approach makes the whole process quicker and more user-friendly.
Table of Contents to Keep Track of Content on Page
Another very welcome feature is the inclusion of a ‘Table of Contents’ section in the sidebar. This section gives you a summary of the different types of content on your page, which will come in handy when writing lengthy posts and trying to keep track of the various sections.
Preview HTML Blocks
Whenever you want to create a new HTML-based section or element – otherwise known as a HTML ‘block’ – you can now quickly preview what this section will look like. With this new feature, you can now insert your code and get a preview right from within the block. The advantage of this is that you no longer need to switch between the traditional ‘visual’ and ‘text’ sections to see what your HTML will look like on the front-end.
Recent Blocks for Faster Block Creation
Another help, time-saving feature which they’ve included in the drop-down menu is the ‘Recent’ blocks feature. Basically, when you click into the menu where you select which element you want, there’s a section titled ‘Recent’. This will show you the most recent element blocks or embed elements you used. The obvious advantage of this, of course, is that if you’re creating a page or post – or a number of pages and posts – with similar content throughout, this will speed up the process considerably. It’s simple but user-oriented, intuitive little features like this that can really help improve the end-user’s experience.
So, to summarize, what are the best features of the new Gutenberg editor?
- Improved overall writing layout and experience.
- Easier and more efficient to use on mobile and tablet.
- Live HTML block previews.
- Easier and quicker to create tables.
- Improved and more advanced embedding of large amount of external sites.
- Table of contents to help keep track of content of page.
- Recent blocks to help facilitate faster block creation.
What are the Drawbacks of the Gutenberg WordPress Editor?
So, having reviewed the new features included with the Gutenberg editor – and what makes these features so appealing – it’s time to look at some of the most common criticisms levelled at the new Gutenberg editor. Let’s take a look, shall we?
Yoast SEO & Other Custom Plugin Meta Boxes
One of the first big criticisms levelled at Gutenberg was that it isn’t – currently – compatible with some third-party plugins, like Yoast SEO. Given the popularity and importance of a tool like Yoast for so many website owners, this is a serious concern. The same problem appears to be arising for other third-party plugins that had originally been designed to integrate with the original WordPress editor.
Although this is certainly a point of concern, it’s by no means intractable. It’s inevitable that a feature upgrade along the lines of Gutenberg would cause integration issues for existing plugins. As soon as the developers behind these plugins re-work their plugins to integrate with Gutenberg, this issue should be resolved. One can certainly understand why many plugin developers might perceive Gutenberg in a negative light, however. We can only imagine the amount of work now facing these developers to get their plugins working again.
Copy and Paste Formatting Issues
Another bugbear among new users is how Gutenberg treats text copy and pasted from external sources. Many content and copywriters – myself included – prefer to write their content in separate documents, with tools like Google documents or Microsoft Word. In the past, you could simply copy and paste this text into WordPress editor and it would retain much of the original formatting. Now, however, it appears to remove the existing formatting – forcing you to re-format all the text. Not only that, but some people are noticing it re-arranges the actual text in strange ways.
Inconvenient New Approach to Content Creation
Another criticism aimed at Gutenberg relates to the new content creation system. With the new Gutenberg editor, you now need to create a new block for every new content element on your page or post. In theory, of course, this makes perfect sense. If your page or post consists of various types of content (from text sections, to images, to video embeds and buttons) this seems intuitive.
What about if your page or post consists largely of text, however?
With Gutenberg, every new paragraph requires you to create a new block. This seems not only counter-intuitive but becomes time-consuming and burdensome.
Changing the Colour of Elements
Some users have pointed out that there appear to be no options to change the colours of elements in Gutenberg. For example, if you add an element to your page or post – such as a button – the default colour is blue. Somewhat surprisingly, however, there is no obvious option to change this colour. This means that you have to use custom CSS to change the colour of your element, which seems deeply counter-intuitive for a visual builder touting itself as user-friendly. Admittedly, this seems like it’s the kind of user experience issue that the Gutenberg developers will resolve in later versions.
Backwards Compatibility: The Big Question
One of the big concerns voiced by many WordPress developers and users relates to backwards compatibility, as we touched on above in our discussion of Yoast. The question many people are asking is this: if WordPress introduces Gutenberg as part of its core code for WordPress 5.0, will this mean that many existing plugins, themes and third-party features will no longer work?
If the answer is yes, this will cause some serious problems for plug-in and theme developers. In order to make their themes and plug-ins compatible with WordPress 5.0, these developers will need to devote considerable resources and time to redeveloping their code and testing out their functionality. For smaller or even mid-size development teams, needless to say, this could spell disaster for their products. Of course, only time will tell as to how WordPress handles these potential problems, but these are very real and justifiable concerns.
The Verdict from Big Dog Digital
The Gutenberg editor, it must be said, is great news for anyone who spends time creating pages or writing posts for a WordPress website. In many ways, a new and improved content editor for WordPress is long overdue. Not only that, but this initial release of the Gutenberg editor is undeniably impressive. The WordPress development team have identified many of the limitations and drawbacks of the original visual builder and sought to re-design with user experience firmly in mind.
And yet, although we’re impressed with this initial release and optimistic about future versions of the editor, we’re not sure it’s quite ready to be included in the WordPress core.
Why, you might be wondering?
Well, the big issue remains ‘backwards compatibility’. Although many of the user-experience issues outlined above are important, it’s more than likely that the WordPress development team will iron these out with each new release. On the question of ‘backwards compatibility’, however, this seems a little less clear. If adopting the Gutenberg editor in the WP core means that many of the most popular plugins, themes and additional features will no longer work – and/or that we will need to configure our WordPress code ourselves and reinstall scores of plugins – this is asking a lot of website developers and owners.
The best approach in the meantime, we believe, would be to offer Gutenberg as a plug-in and gauge its popularity on a wider scale. Simply including it in the WordPress core – which gives developers, designers and website owners little choice but to re-integrate it into their sites – would be a misstep.
Let’s hope the good people at WordPress listen to the thoughts and concerns of the web development community on this. Otherwise, they risk losing the admiration and confidence of many of their most vocal advocates – Big Dog included.