The way you develop for and create content with WordPress is changing. With the release of WordPress 5.0 and the new Gutenberg editor, there will be a lot of adjustments to make. They not only affect what we see on our screens, but also the underlying techniques we use to customize the back end.
What’s especially important to note is that it’s not just web professionals who will bear the burden of a changed workflow. Everyday users will also have their own learning curve to deal with. The simple act of writing a blog post, for example, will look much differently with Gutenberg than with the Classic Editor.
That’s not to paint any of these changes as either positive or negative. Regardless of how you feel about them, they are changes nonetheless.
So, what’s changing? Let’s have a look at some areas that WordPress 5.0 will have its greatest impact.
Your Web Designer Toolbox
Unlimited Downloads: 500,000+ Web Templates, Icon Sets, Themes & Design Assets
Writing with Gutenberg
The most visible change with WordPress 5.0 is the block-based Gutenberg editor. Gone are the days of a single rectangular field to type away at your next blog post. Instead, virtually everything is contained with portable blocks – including text paragraphs.
The positive side of this change is that it’s easy to rearrange content – something that could be frustrating with the Classic editor. A user can, for instance, edit one block without fear of impacting any of the surrounding content.
Still, it’s going to take some getting used to – especially for longtime users. The UI is fairly intuitive, but a different experience altogether from what a standard WordPress install has been.
Oh, and one tip worth mentioning about those paragraph blocks: Hitting the Enter key at the end of one paragraph will automatically create another new block. So, you can continue writing in the editor without having to manually add blocks via the UI. Alternatively, you can use the “Classic” block, that allows for the more traditional style of content writing.
Customizing the Edit Screen
Among the biggest changes with WordPress 5.0 and Gutenberg are how customizations to the edit screen both look and are built.
For example, if you use a plugin such as Advanced Custom Fields to create custom field UI setups, it will still work just fine. But Gutenberg forces these fields down to the very bottom of the screen. Therefore, any elaborate custom layouts you’ve built for the back end are going to be stuck below the fold – unless you opt to remain with the Classic editor.
Thankfully, the aforementioned Advanced Custom Fields and the new Block Lab plugin both provide easier methods for creating custom blocks. This will enable more developers to build in custom capabilities for the new editor without diving too deeply into the weeds with JS. The process will be more familiar, yet still requires some effort to learn.
All told, customizing the edit screen will require a very different approach in order to achieve the same level of integration with the WordPress editor’s UI.
Building a Custom WordPress Theme
It seems fairly unlikely that Gutenberg will “break” any themes. Instead, existing themes just may not be setup to take full advantage of some of the fancy new features, such as cover images.
By default, some “baseline” styles for all Gutenberg blocks will be included. However, you can also add custom styles to your theme in order to better control how blocks look on the front end of your site.
Want to see how your theme will handle each Gutenberg block? The Block Unit Test for Gutenberg plugin can help.
It’s also possible to include (or withhold) support for specific features, such as full-width images, via some code in your theme’s
functions.php file. This provides you with some measure of oversight regarding what your theme can or can’t do with Gutenberg.
Lastly, one of the main selling points of Gutenberg is an experience that is much closer to being truly WYSIWYG. To get as close as possible, adding editor styles to your theme can provide a more accurate reflection in the editor of how content will look on the front end. WordPress has a built in a handy .editor-styles-wrapper class to get you going.
Rolling with the Changes
In some ways, this may all sound a bit overwhelming. But while change isn’t easy, it’s also inevitable. Therefore, all we can do is make the best of it.
A positive aspect of all of this is that, even though WordPress 5.0 is out there, we can still opt for the Classic editor if we so choose. This empowers us to make the final decision on whether these changes are a good fit for our own particular situation.
The Classic editor will be supported at least through the end of 2021, meaning we have some time to adjust before taking the plunge into Gutenberg. So, while our workflows are indeed going to change eventually, we get to do so at our own pace.
Yes, it’s a lot to take in. But at least we have the necessary tools and knowledge to handle these changes successfully.