So Gutenberg is finally here in WordPress 5.0. If you haven’t been paying attention, you should probably start now, because if you use WordPress, you might be mystified and/or mortified by the changes. So in a nutshell, I’ll describe Gutenberg here and what you need to know about it. If your site has broken because of Gutenberg, there’s something you can do.
Gutenberg is the name of the new editor that’s now part of the WordPress core beginning in version 5.0, released in early December 2018. Before, when you created a new page or post, you used what’s now being called the “Classic Editor”, a kind of lightweight word-processor, similar to a bare-bones version of MS Word. It’s been pretty much unchanged for the last decade or so.
Gutenberg, on the other hand, is more than a content field. It’s a being touted as a modern editing experience and will be the foundation for building with WordPress from now on. If you’ve ever used a third-party page builder like Beaver Builder or the Genesis platform, then Gutenberg will look familiar to you because it uses a similar “block” approach for creating.
Gutenberg will be rolled-out in three phases. The first is the inclusion in WordPress 5.0, and that phase focuses on implementing “blocks” for a “content-first” approach. This will clear the way for the next two phases that will go beyond creating “posts” to actual page templates, then finally into full site customization.
The editor will create a new page- and post-building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery. — Matt Mullenweg
Blocks, in my opinion, are a welcome addition because they get rid of some of the clunkiness that I hated about WordPress. By that I mean blocks replace much of the need to use other formatting tools such as theme options, meta-boxes, shortcodes, embeds, widgets, post formats, custom post types, and others. Blocks are used to organize and compose content. They allow WordPress to be as functional as ever but without all the hacking and add-ons. It always felt like I was using some sort of Frankenstein approach when I was creating a page, and if you know code and appreciate its purity, you understand what I mean. Creating with WordPress wasn’t a clean way of creating at all. Blocks completely change this and it completely streamlines the user experience. I welcome that.
Blocks actually unify multiple interfaces. This streamlines the whole writing, editing, and publishing experience by way of simplicity. And developers can create their own blocks which means way less piecing together of shortcode, widgets, hacks, and plug-ins. To me, that implies a potentially faster, lightweight site with fewer elements that need updating or that could potentially break your site.
Blocks can be static or dynamic and each one contains configuration settings. They are hierarchical, so they can be a child or a parent to another block. They contain rich formatting tools for composing content instead of using text plus inserted media, embeds and shortcodes (although there IS a shortcode block). With one block you can do what a boatload of plug-ins would do, and I found blocks to be quite intuitive. I like that. Blocks focus on how the content will look without needing to use other configuration options, and this approach means that bloggers and developers can present content in a more engaging, direct, and visual manner.
The new Gutenberg editor is designed specifically for creating content-rich and flexible website designs. Paragraphs, headings, media, and embeds now become the content that’s stored in the WordPress database.
I should tell you at this point that when WordPress announced the coming of Gutenberg, I was not a happy camper. I was angry and I didn’t want to be forced to learn a new way of using WordPress because the current way was difficult enough, what with having to click around so many areas of the dashboard to find where to change this, or modify that and requiring the downloading of widgets and such. We end up literally piecing together a functioning site. It was often confusing and frustrating and it felt like a primitive and hodge-podge way of “developing”. And it felt risky at best. I thought Gutenberg would just add another level of unnecessary complexity and I resented that. I resented what felt like having no say and no choice if I wanted to keep creating sites in WordPress.
So here’s what I did. I decided that the best thing to do, for me, was to see how it worked and so I installed the beta plugin of Gutenberg.
I have to say that using Gutenberg was a little confusing at first, after being so used to the previous editor. Putting no pressure on myself, I just started playing with it on a test-site, to see what it could do. First, I found within a few minutes that it was kind of fun. I should also tell you at this point that I went ahead and installed the Atomic Blocks plug-in and Atomic Blocks theme (atomicblocks.com) to extend Gutenberg’s functionality and it made a big difference to me. Now there were even more cool things I could do with the blocks. Second, within just a few minutes, I had created a pretty nice looking page, designed totally from scratch from a blank page, using only blocks. It seriously would have taken 2-3 times as long to do that in code. And because you can see your changes live, as you go, there’s no clicking back and forth to the browser to see your changes take effect, like there is when you’re writing in code. So there’s that.
I was concerned about compatibility, and I’m pretty sure there are lots of us out there still dealing with the anxiety that the Gutenberg roll-out has caused. For those of us who have highly-tailored existing sites, it’s good to know that our posts are totally backwards compatible, and our shortcodes still work. WordPress is exploring how to accommodate highly-tailored metaboxes, and is looking at other desired solutions such as a plugin that disables Gutenberg altogether, or possibly auto-detecting whether Gutenberg should even be installed/activated or not.
Not saying it’s better in any way than writing in code. I’m still a code girl. But it’s a nice alternative.
Here’s the Gutenberg Handbook for Designers and Developers in case you’re interested.
If you don’t want to use Gutenberg just yet, there is a way to keep the “Classic Editor” as the default. Go to “Plug-ins” and “Add New”. In the search box, input the keywords “Classic Editor”. Once it appears as a choice, install it and then activate it. IF YOU’VE ALREADY USED GUTENBERG to create a page or post, your formatting and CSS will be wiped out. So be careful.
Also, you know to make a backup of your full site before updating to WordPress version 5.0 and installing/activating/using Gutenberg, right? Just sayin’. Look in your C-Panel to find any backup utilities you could use. There are several WordPress backup plug-ins available as well. Go to Plugins>Add New>and search for keyword “backup”. Of course, you could also have me do it. I’d be happy to download a copy of your entire site, databases and all, for you to keep somewhere safe and sound, to restore your site in a jiffy if need be.
WordPress will continue to find ways of ensuring that a page’s existing functionality continues to work while allowing us developers the necessary time and tools to make a smooth transition. And I think that Gutenberg will certainly create desirable opportunities for plugin and theme developers to begin designing even more visually engaging user experiences.
In the meantime, if Gutenberg’s got you down, give me a holler. I can help with that. I’ve been using Gutenberg since it was available in the beta version as a plug-in and I’ve developed a couple of live sites with it.
Email me at [email protected]
More contact information is on my site Imageandaspect.com.
Other articles you might like:
About the author
I developed Image and Aspect because I believe that professionals need to have an impactful web presence. One that showcases their unique talents, skills, and abilities as well as their values and style. A presence that focuses on social engagement and connection.
I’m passionate about what I do; I like helping fellow humans, I like having all kinds of social connection with others, and I want to give back, to make the world a better place.
I do much of the designing and coding myself, and I also have a wonderful network of professionals that may contribute as well; photographers, copywriters, branding experts.
I love designing and coding beautiful, elegant and responsive web creations. I ALSO teach and help others who want to learn how to do it themselves.
‘Tips and Snips’ is my blog, and it’s full of information and inspiration to help transform any online persona from “meh” to AMAZING! Sign-up HERE to get blog posts right to your in-box every Friday! I write about Design, Marketing, Search Engine Optimization, Branding, Vlogging, Color Theory, HTML5, CSS3, Bootstrap, WordPress, Social Media…anything you’d want to know to get yourself noticed online.
Diane M. Metcalf, M.S.