WordPress is currently at version 4.9.8 and the Gutenberg 3.4 editor preview is available as of August 2, 2018. When WordPress version 5.0 releases Gutenberg will become the default editor in WordPress 5.0.
Matt Mullenweg, co-founder of WordPress, said that after one hundred thousand users and two hundred fifty thousand blog posts, Gutenberg could be ready to be released with WordPress 5.0 as soon as August. He also pointed out that he is not making any promises.
As of this writing, over 3,000 active plugin installations are in use to disable Gutenberg. Here is the link to one plugin – https://wordpress.org/plugins/disable-gutenberg/
We are not ready to embrace or disable Gutenberg. Instead, we recommend testing.
When you log in to WordPress you will now see the following Gutenberg Nag Screen:
Once you dismiss this screen, it won’t reappear. If you decide you need to bring it back, open the “Screen Options” drop-down on the Dashboard, and check the “New Editor” option. Then the Gutenberg nag screen will reappear.
To get familiar with the Gutenberg admin area, here is a 20-minute introductory video that reviews the Gutenburg editor and how it currently works.
Transcription
Hey, Mark Cahill here for BlogWrangers. Today we’re going to talk about the Gutenberg Editor which has become available in your admin console for WordPress.
I should probably do a quick introduction. I’ve been doing content management for a long time. I used to work with Atex Media as Product Manager for Internet Content Management for newspapers. I’ve been working with WordPress for about a decade and a half and done a lot of sites, some of which you’ll know. I am certified on Ektron. I was the Director of Software Development for Lycos where I worked with Tripod and Angelfire, two of the early online web publishing systems. I’ve worked with Joomla, Expression Engine, and Drupal. So I know content management a little bit.
At any rate, let’s take a look at the editor that became available in your admin console last week.
This is what you’re going to see: Try Gutenberg. My first advice to you is DON’T try Gutenberg right away. There’re a couple of reasons.
First, it makes a fundamental change to the way we handle the content area of our pages. That could be a potential problem if you have a plugin that already works in that area, that do things you need them to do. I have anecdotal information that there are some problems they are working towards fixing on Gravity Forms, and there are meta box problems, supposedly MailChimp has some problems and there are a bunch of plugins that may have problems. So we like to test it before we go live.
The other reason not to hit the button right away is you will need some time to work with it first. Don’t just figure you are going to push the button then go in and do a quick edit and post content. It is a fundamental change. It really makes a big difference. That said, I don’t see a reason it can’t work in the future.
Just so you are aware, it changes the content area by introducing the idea of blocks. Now blocks are something other content management systems have used in the past. I should say, a lot of you are probably saying “Wait, content management? This is my blog.”
Well, WordPress is a whole lot more than a blog system now, it can handle some very complex sites and at BlogWranglers, I have gotten to do a lot of them. It does a whole lot more than a blog and I know a lot of you have seen that over the years.
This change allows us to get better control as developers of the content area. It kind of gets away from the “old west“ free-for-all that was going on in the content area. That said, it didn’t really have to change. We could have gotten by.
Now, you’ll see there is a post from WordPress about what Gutenberg is. Let’s take a look. First, you’ll see a very clean editor. You will not see a lot of the stuff you’d seen in the old editor. They say it’s an “entire editing experience rebuilt for media-rich pages and posts. “ From what I’ve seen that’s true. They have a lot of predefined blocks that they did not have, and certainly a lot of stuff that would have been handled via plugin before, you don’t need plugins for these now in the content area for things like Youtube, Vimeo, SoundCloud, Meetme, etc. Those are things we were basically pasting javascript for before, so now we’re managing a little better.
Additionally we have the ability to predefine text blocks of our own. It’s pretty cool.
They show us how to add a block (they sure make it much easier, don’t they?).
Here’s a bunch more thing s you’ve got. Paragraph, heading, subhead, quote, image, gallery, cover image, and each of these has a whole lot more going on.
Additionally, we can define our own blocks going forward. If we do something all the time, well, I have a saltwater fly fishing site. We’re always interested in the weather, or the stage of the tide where someone ‘s fishing report came from. So I could define a block for weather and tide and have an area that is always going to look the same. As content managers, we like our stuff to look the same. Our users get used to looking at our pages, and just by the look, they know what it is. Consistency is important.
Developers love this because it works well with the REST API. You may not have heard this but it gives developers a lot of access to the WordPress Systems. One of the things I used the REST API for was with Tripod to integrate Lycos’ own registration and billing system into WordPress. It was pretty cool using the API (application protocol interface).
Now, this is interesting. “The editor is just the beginning. It’s the foundation that’ll revolutionalize customization and site-building in WordPress.”
Yeah, that sounds a bit scary, doesn’t it? It doesn’t want everything to change. It sounds like a lot of work, and I kind of like things the way they are right now, but we’ll see.
Let’s go over to the editor now. On my own site, I’ll click “try Gutenberg ”.
Okay, it shows me the “welcome to Gutenberg” post.
I’m going to go over and start fresh because that’s how I roll.
That is pretty simple, that’s my first block, actually my second, as the title was a block.
Let’s take a quick look at our page before we go too much further. We’ve got document properties on the right. This stuff looks really familiar from the old way we handled it. It looks a lot cleaner, Everything is more succinct. For users who haven’t been trained, it may be off-putting. They may not be sure where everything is.
Then we’ve got block properties. Here we have paragraph block, We’ve got some text settings, custom size, small, medium, large, add a drop cap (that’s new!). Add colors, that’s all stuff we had before. Here’s the one we didn’t have before: Advanced. This allows us to add a CSS class. Before we’d have to go out of visual mode into text and put a span or a div around the text. That would be how we’d attach a class. Now we can do it right here and, even better, it is using it and we’ll see it right in the editor. That is something we never had in WordPress before. I like that, instead of going back and forth with “view post”.
Let’s go a little deeper here. Add Block – the minute you hit “enter” it creates a block because each paragraph will be a separate block. In this case, let’s look at what we want to add. There are inline elements, most used, common blocks, formatting, layout elements, widgets, and embeds. Let’s look at common blocks. These look like the ones from the old editor, we’ve got
Formatting, Tables, Preformatted, Code, Layout elements, Button (that’s kind of new), Columns – a lot of the themes allowed that already. More, page break, spacer, we’ve seen that before.
Okay, widgets, shortcodes, archives, categories, latest comments, latest posts, this is where you’ll add stuff via a plugin.
Then we get into the embeds. This is where I was impressed. Youtube, Facebook, Instagram, Animoto( I’m not even sure what that is), CollegeHumor. The idea is that we’ve got all of these which you may or may not use here, like SlideShare, which I use a lot. But, if you can do that with an embed, you can do other stuff, and you can create your own at some point.
Let me just show you, ah, let’s add, we’ll use an image. We’ll use this. It’s a simple image. It’s a simple screenshot. How we select the image…oh, this is cool, I’ve never done an inline image. That’s pretty cool…but let’s go down and use a regular image. Grab that…now you can see it’s a full-width image, not really interested in that, so I’m going to go with medium, and I like it to the right. Now it gets interesting. See these two buttons? Watch for them. I’m going to add a caption here, then as long as they are lit, we can hit the enter button and it takes us right into the paragraph block beside it.
Okay, if we go back and highlight the image, we’ll see the block properties are now set to image properties. Which gives us width, link, link URL, and advanced, which, you guessed it, gives us CSS class.
So let’s hit our enter button, that gives us this + button, add another block, let’s make it a quote, I always love quotes. And it’s got a space for citation, always nice.
So I add a new block here by clicking on it. You can see I can always add an image, a headline, quote here just by clicking the icons.
If you do that you’ll see it will give you the image upload and image library right there. So we click this icon that looks like settings and that gives us a preview of the content area. So we click publish and there it is.
You’ll see that since I’m logged in there is an edit button and that’s not really in the content.
So that’s it. The things I am concerned about are Gravity Forms, things that work inline on the content areas. If you’ve got an e-commerce site you should be testing every plugin before you go live anyways. Major changes should all be tested. You don’t want that thing breaking and not being able to get back to where you were. I’ve got a site on Woocommerce I’ll be testing later today and I’ll report back on my blog. What else…MailChimp supposedly is reported to have a problem. I haven’t heard an awful lot. I see many devs on Twitter. I do watch the #wordpress hashtag.
Once again, this is a fundamental change, but this will be the editor, so we need to get used to this.
If you need training for a team of people who work on your site, we are happy to do that at BlogWranglers. We can do that online with you. We want you to be comfortable with this moving forward. I think it is going to give us a lot of opportunities. Once again, if you’ve got a heavily customized site, it needs to be tested and we are happy to do that with you.
Obviously, you may be able to do this yourself. If you’ve worked with WordPress for a while, you know how it goes.
That’s the quick tour. Thank you very much. We will be talking again with you very soon, I’m sure.
End of Transcription
And here is a link to more information on WordPress’s new Gutenberg editor from WordPress – https://wordpress.org/gutenberg/
Let us know in the comments if you are keen on Gutenberg, if you have started testing or if you have concerns.