Getting Ahead of Gutenberg

One of the biggest changes to WordPress ever is coming soon. Are you ready? How can you prepare? Why is WordPress making this change anyway? These questions and many more have been flying around the WordPress space for nearly a year since the new Gutenberg editor was announced by Matt Mullenweg in Summer of 2017 and with good reason. Many developers have concerns, namely around backward compatibility. Read on to learn how Gutenberg will affect your existing site.

Intro to Gutenberg

For those who have not yet heard, Gutenberg is the nickname given to a new Editor for the WordPress Admin interface. This is big news because while many things about WordPress have changed since its birth, the editor has remained a fairly basic visual and HTML user experience. As a result, plugin and theme developers created add-ons and new functionality for the editor to fill their needs. This caused developers and many websites to become heavily dependent on shortcodes. WordPress is creating a more unified experience between what users create in the backend, and what displays on the front end. In this way, they are baking in some of the functionality so many users find “essential,” and particularly the functionality non-technical users need.

The other rift that grew deeper with time was that what an editor sees on the back-end did not necessarily represent what displayed on the front-end. As plugins and themes began integrating page builders and drag-and-drop components for ease of use, WordPress remained a plain text editor by default. Gutenberg solves for this disconnect as well. Not only does it make the editing experience more natural and fun, it also more accurately represents what will show on the front-end–a true “what you see is what you get” experience. It divides text, images, media, and more into building “blocks” which make up your pages.

Blocks

The foundation of Gutenberg is a concept of “blocks.” You can edit classic content sections in fun new ways like adding highlights and background colors, easy resizing, and easy wrapping and embedding of classic elements like photo and video. This means for other items users might embed in a page, these elements have custom blocks. You can add a block for a contact form, a tweet, block quotes, and more. The purpose of blocks was to bring a sense of continuity and regularity to the way different types of content were created. With one uniform way to create a block, even if your end goal for functionality is vastly different from others, there is a known “WordPress way” to create the code for it, which inherently helps the security and scalability of the platform as a whole.

Backward Compatibility

Okay, so Gutenberg will really help new users with new websites have a better experience. What about my existing posts and pages? Is this going to break things? There’s a lot of panic around the community surrounding backward compatibility with their existing posts. The nice thing about Gutenberg, as Matias Ventura aptly put it, is that it does not intend to completely replace the old–everything you have and use today will still work–but instead to gradually shape behavior and development with the new.

What does that mean, exactly?

Shortcodes still work as they do today
Existing posts still exist exactly as they do today
All functionality of the old editor is retained in the new editor
Page builders still work, although their functionality may be partially duplicated in Gutenberg

Remember: the thought behind it all is, simply put, you shouldn’t have to download an extra plugin or premium theme for functionality that nearly every user can agree is “essential” to the WordPress experience.

Planning for the Release

With Gutenberg slated for release in WordPress 5.0, and WordPress 4.9.4 having shipped already, the deadline is certainly imminent: WordPress 5.0 is likely to land in the coming months. This has people wondering how best to prepare, and we certainly understand why. You can rest easy knowing these options and features are available:

Firstly, your existing pages and posts will be converted to Gutenberg using the “Classic” block. This allows them to exist and display just as they do today without any manual intervention.
Second, if you edit an existing page or post and anything unexpected happens, you can easily restore using a plugin.
Third, if you simply prefer the legacy editing experience, you can download the Classic Editor plugin to revert back to the editor you want.

Gutenberg is exciting because of the uniformity, security, and the better user experience it brings to WordPress. Given the fact that much of the code is changing, and all the various ways people use WordPress, our team highly recommends you copy to your staging environment and download the Gutenberg plugin to test it there before Gutenberg is released as the primary editor. There are workarounds, like the plugin mentioned above. But we encourage everyone to give Gutenberg a try first. The Gutenberg plugin has been through nearly 30 releases and patches since its initial release in June of 2017, so naturally, there has been some evolution for compatibility and usability. This also means if you tried it before and were not a fan, you should probably try it again and see how it has changed. And, if you are a developer, you should take a look at the Gutenberg handbook to start adapting in creative and fun new ways.

The entire WordPress community has rallied around this project to help ensure its success, and the result is impressive! If you encounter any scenarios that cause concern while testing, this is your opportunity to give back to the WordPress community by contributing your thoughts, voice, and even developer skills to the Gutenberg cause to help make it even better. And if you encounter any issues in testing, please report them! The Gutenberg team is eager for feedback to help ensure all issues are addressed. The open source nature of WordPress means a thriving worldwide community of developers is heavily invested in making a successful editor that works for everyone.

There are 5 comments

April 17, 2018 #

Jonathan Thomas

I’m not panicking, but I’m pretty meh about it. I’ve been using WordPress for 10 years and prefer a plugin for the extra functionality. But OK. I just hope nothing breaks.
April 17, 2018 #

Matt

The official release of Gutenberg / WordPress 5 is not imminent if the Make WP Core site is anything to go by. They’ve yet to even decide a date for the kick-off meeting, let alone have the meeting itself.

Nonetheless, I have been preparing since last year. Learned a lot and when it’s go time, I should already be good to go.
April 18, 2018 #

George

> The entire WordPress community has rallied around this project to help ensure its success, and the result is impressive!

That is one way of seeing it.

If the reviews are anything to go by or the many comments against GB on blogs like WP Tavern and Github threads, one would think that “the entire WordPress community” is split at best on the topic.
April 27, 2018 #

Stephen Vaughan

While I totally agree that Gutenberg will give new users to WordPress, especially those new to working with a websites, a good gateway to the world of web design, its a bit naive to think the tools in Gutenberg have the scope to produce anything sophisticated without resorting to digging into css.

Page and visual builders go some way to affording this level of design without code, but I suppose novice users are still going to be intimidated by the full array of controls and settings panels and generally finding stuff. I would actually say that this is always going to be the dilemma for new users no matter what you give them, so to this end every effort should be made to alleviate this pain point.

I like the UI of Gutenberg in some respects. It is very good for what it is being designed to do at the moment but brutal for many other use cases that many professionals might use in their workflows. I expect thing will evolve as more and more people engage with Gutenberg and blocks.

It is also naive though to suggest that the Gutenberg user experience bridges the gap of the disconnect of what is happening on the front end.

At this point in time only the more sophisticated visual builders are doing that but I have to say that for the uninitiated even with this level of working directly on the front end visually is going to pose some challenge.

One way or another users have to experience some level of cognitive challenge in mastering these technologies. There is as aspect of all this that requires users having to apply them selves a little to get on the web design wagon. Which is why I would like Gutenberg to ultimately be very much a visual builder on the front end, albeit a basic offering, so as not to overwhelm new users, one that structurally has a box model that incorporate sections/rows/columns and an api that page and visual builders can hook into. This way users gain confidence they can move onto those as well.
May 14, 2018 #

Ronalee

I feel saifsited after reading that one.