- Aug 05, 2018
- by Brad Litwin
The WordPress editor has been around for almost as long as the platform itself. It’s no-nonsense and easy to use, but it’s not as slick as some modern page-building tools. That’s where the Gutenberg editor comes in.
Gutenberg is WordPress’ attempt to modernize its editor and make it simpler for users with no experience to build websites. With Gutenberg, it’s easier to create sites using a visual interface, adding elements and rearranging them quickly, which is something a lot of people are sure to welcome.
In this article, we’re going to talk about how Gutenberg came to be and what it means for WordPress moving forward. We’ll also show you how the editor works by going through its key features. Let’s get to it!
An Introduction to the Gutenberg Editor (And What It Means for WordPress)
The Gutenberg project was announced during WordCamp Europe 2017 as an overhaul of the existing WordPress editor. At the moment you can try it out for yourself by installing the plugin that’s still in the beta testing phase. However, once Gutenberg is ready for prime time, it will replace WordPress’ classic editor altogether.
Unlike other modern Content Management Systems (CMSs), WordPress editor has never provided users with a true front-end editing experience. In other words, the content you see in the editor can look very different on the live site. There are several popular site-building tools that enable you to build your site with a WYSIWYG interface, but WordPress itself has stuck to its TinyMCE based editor all the way. Gutenberg will change that, with an editor that offers a more visual approach to page building, based on the use of pre-built page blocks.
To be clear – Gutenberg is still in beta, but the response has been mixed so far. Some are worried about the impact it’ll have on plugins and themes, while others believe the editor should be left as an optional plugin, instead of being included as part of WordPress core.
Gutenberg supporters, on the other hand, argue that Gutenberg is exactly what WordPress needs – a step forward. Right now, WordPress is the undisputed king of CMSs, with nearly a 30% market share of all websites. However, refusing to innovate and adapt to a more intuitive page-building approach could be the death of the platform. We decided to take a closer look at the new editor before casting our vote, and here’s what we found.
How to Use the WordPress Gutenberg Editor
If you want to test Gutenberg, you should first create a WordPress testing environment. Because the Gutenberg plugin is still in beta, it could have an adverse effect on your site and content, so we don’t recommend using it on a live site.
Once you’ve got your testing sandbox ready, download and install the official plugin from the WordPress repository:
When you activate the new plugin, WordPress will use the Gutenberg editor by default when you open any page or post from your dashboard. You’ll also have the option to use the classic editor instead:
The differences between WordPress’ classic editor and Gutenberg will become apparent as soon as you launch the latter. Gutenberg features an overall sleeker look, and it’s less cluttered than other modern page-building tools:
If you’re a writer, you might appreciate Gutenberg’s minimalist style. Writing in Gutenberg feels very comfortable. However, there are a couple of details that can break the spell. Adding images or subheadings, for example, requires you to add new blocks, as seen in the example below, which is a tiny detail, but a bit annoying:
Blocks themselves are at the core of the Gutenberg experience. Every element you want to add to your pages or posts involves creating a new block. Gutenberg provides you with several options, including galleries, lists, quotes, and more. More importantly, adding them is very straightforward. You just need to click on the plus sign below your existing blocks, and you’ll be able to choose what type of element you want to add:
Once your block is set, you can get to writing or adding the elements you want to it. Gutenberg recently also added one feature that most modern site-builders have long since included – drag-and-drop rearrangement. You can also move blocks up and down using the arrows on the left side of each block:
Moving on, Gutenberg includes support for columns, which is a feature WordPress’ classic editor sorely lacked. You can add both text and regular columns, but only the former seems to work without issues at the moment. Adding more than two regular columns to a block will also quickly turn the editor into a mess.
The lacklustre implementation of columns at this stage in the editor’s development is a bit worrisome. If you’re the kind of user that likes to use page-building tools to design pixel-perfect pages, you’re probably not going to be making the jump to Gutenberg anytime soon.
Having said that, it’s worth noting that Gutenberg is indeed a big leap forward from the classic WordPress editor. If you’re a blogger, you’ll probably love the new interface, since it provides you with a lot more styling options. However, if you’re the kind of user that relies on WordPress to power more complex websites, chances are Gutenberg isn’t right for you at the moment.
If you worry about missing the old editor, don’t worry. First of all, remember that the plugin is still in an early stage of development and is subject to major changes. Additionally, even when Gutenberg becomes part of core, you can use the Classic Editor plugin to revert to the old editor at any time.
For a while now, many Content Management Systems (CMS) have offered visual builders as a core feature. This approach makes it easier for people without a development background to build their first websites, since it’s entirely visual.
Now, with Gutenberg fast approaching, WordPress is ready to jump on the module-based approach to website building. The new editor is still lacking in some areas, but it’s easy to use and offers features its predecessor didn’t. It delivers on the promise of a visual editor for WordPress and we’re excited to see how it evolves in the future.
Image credit: Pixabay.