Gutenberg Changelog #29 – Gutenberg 9.0, Global Styles, Query Block, Enhancements and more

In this episode, Birgit Pauli-Haack and Mark Uraine discuss Gutenberg 9.0, Global Styles, Query Block, Enhancements and more.

Transcript

Birgit Pauli-Haack: Hello, and welcome to our 29th episode of the Gutenberg Changelog. In today’s episode we will talk about Gutenberg 9.0, Global Style, the Query Block, the Widget Block, and we will have some listener questions. I am Birgit Pauli-Haack, curator at the Gutenberg Times, and I’m here with my co-host Mark Uraine, designer at Automattic and core contributor to WordPress. So how are you today, Mark?

Mark Uraine: Hey, Birgit. I’m doing okay. I’m enduring the California fires right now. Lots of unhealthy weather and that just keeps us indoors for longer periods now, even though we’re anxious to get outside and go for walks. We’re choosing not to, because the air quality is so bad. How’s Florida been? Florida life for you lately?

Birgit Pauli-Haack: Florida life hasn’t changed since March. It’s hot, it’s humid. And that got even worse in the months of May and June, August, September. Hurricanes are coming through. We’ll it’s just the other disaster, but other than that, I feel great. We pushed a couple of client projects forward this week and we are getting ready to take them live. So it’s always a great energy there. And I was looking forward to the show all week. Thanks for being here with me.

Mark Uraine: For sure. Our shows are fantastic, you and I.

Listener Questions

Birgit Pauli-Haack: And so, today we also have a few listener questions. Jimmy sent in one via LinkedIn or it was more an observation, but I think there was a question mark behind it. “I played with Navigation Block today,” he wrote. “And please excuse my ignorance, but I couldn’t find how to use color picker to apply a color to only one item of an existing menu.”

Mark Uraine: Jimmy, I took a look at this as well. I noticed that there’s really not that option or that setting there right now. I looked in a couple different areas. So for a block, you might check the sidebar settings, to see if the color settings exist there, or I also checked in the block toolbar in the dropdown. Sometimes you can change the individual text, color, in-line text color, and neither of those showed up. So I know there’s some other settings there and they’re looking at adding the ability to include other blocks in the Navigation block. And with those other blocks, there might be more needed use for adding some background colors to individual items or changing text color on individual NAV items, but that was a good observation. Something we should probably look at.

Birgit Pauli-Haack: And I’m going to test this a bit, because I am actually looking at changing the background color of a single menu item, to just draw some attention to it. Like non-profits and have the donate link there or contribute or something like that. 

Mark Uraine: Stand out somehow, right?

Birgit Pauli-Haack: Yeah, yeah.

Mark Uraine: That might be a good call, a good reason to get that button block in there.

Birgit Pauli-Haack: Absolutely.

Mark Uraine: Be able to add a button in line with the navigation items, that looks differently. Jimmy, thank you so much for asking that via LinkedIn though. 

On Twitter, Alvaro Gómez Velasco who is Mr. Foxtrot asked, “Which Gutenberg feature, Workflow or UI element do you find new users are struggling with the most? Thank you, Birgit and Mark.” Birgit.

Birgit Pauli-Haack: Well, I think the new user … I’m always a little bit hesitant to identify a new user. Is that new user coming from the classic editor or is it someone totally new to WordPress? But I think, what a lot of people have trouble with is that the block toolbar is right there on the block and sometimes covers stuff on top of it, or moving it up to the top toolbar on the top of the screen, that’s certainly something that not a lot of people know, because it’s not discoverable. You need to go to the gear and then look for it. That’s one thing. 

I also have seen quite a few complaints, that the full screen editing, not everybody is really happy with that and some users would like to see the admin bar still, when they’re editing some post. And they find how to switch it off, but the problem is, how to make it remember that choice. It seems to be that every browser, if they lose the cookies or the local storage by the end of the browser session or it’s automatically deleted, the next time it’s there again. I know there were some ideas to, actually, store that information in the user metadata. I don’t know how far away they are.

Mark Uraine: I don’t know how far either. That is a point of contention, for sure.

Birgit Pauli-Haack: Another thing that I see is that the image alignment…. So if someone wants to replicate the idea, “Okay, I have my blog post and on the top of the blog post, I have a right aligned image to call.” How to make that with an image block, sometimes it seems to be a hurdle there, until people learn how to use that and not have the image under the paragraph initially, above the paragraph and then the left and right alignment.

Mark Uraine: And can I add to that one?

Birgit Pauli-Haack: Sure.

Mark Uraine: On that alignment, you’re talking about there, I remember distinctly users would still, even in the classic editor, there’s always a really big challenge to get two images side by side, right? And that’s much easier in Gutenberg, with the gallery block or some of these other ways, columns, block and things, but they aren’t always really intuitive for new users. I see them all the time. They add an image, then they add another image block and then they try to drag it next to one above it, right?

Birgit Pauli-Haack: Yeah.

Mark Uraine: So that they’re side by side. And it just doesn’t work that way.

Birgit Pauli-Haack: Mm-hmm. You’re right. That’s interesting, when you watch people do that. And you know it doesn’t work and then how can you help them?

Mark Uraine: Yeah, yeah.

Birgit Pauli-Haack: And I have seen a lot of people try to do this and make it to line up with a paragraph and they don’t know about the media and text block, which does it beautifully. It’s really the secret weapon for that. On blocks.gutenbergtimes.com, I have a few ideas or concepts what to do with a media and text block, but it’s really something that … it doesn’t surface to the attention of the user. And so, that’s one thing. And I think the reusable block, they would need some. Everybody jumps on it and likes it very much, but then they stumble over things. One is that the content changes on all of the block, which is the idea of a reusable block, but if they want to use it as a block pattern, then that doesn’t work. So I’m glad there are now, block patterns, so you can say, “Okay, do I use a reusable block or do I make a block pattern?” 

And just as a side tangent, I found a plugin in the repository that actually lets you as content provider or content producer, not as a developer, but content producer create block patterns, they are saved as a custom post type and have it show up in the inserter. So you only have to provide them once.

Birgit Pauli-Haack: It’s called block meister.

Mark Uraine: I’m going to look for this, because this could easily become one of my favorite blocks or plugins. It sounds like a fantastic idea.

Birgit Pauli-Haack: I think that was a longer answer. Thank you very much, Alvaro Gómez of Velasco, to send us those two, but there was another one. A follow-up question, “Which non-core block, do you see more demand for?” I have to think about that.

Mark Uraine: We did, right? You and I talked a little bit about this. There’s one you thought about, was the Card Block. And I do remember seeing a lot of requests for something like a Card Block. In fact, I know or I’m fairly certain that Q has worked into some of his styling and stories on the storybook, if I’m not mistaken.

Birgit Pauli-Haack: No, you’re right.

Mark Uraine: The components, that’s what I’m trying to get at. And then, there’s also the Layout Grid Block from Automattic right now. It’s a plugin just specifically for the layout grid and has over 50,000 installs right now.

Birgit Pauli-Haack: That’s quite popular. I see a lot of people are asking for Accordion Block, because you can hide and show things. And quite a few plugin suites or plugin collections have an Accordion Block and quite a few people like that. Especially when they do FAQs or a glossary or something like that.

Mark Uraine: Well, good news, we do have an Accordion Block underway.

Birgit Pauli-Haack: All right. Getting an Accordion is good. All right. 

Gutenberg 9.0 Release

Now, Gutenberg 9.0 is released. It was Isabel Bison’s first release. Congratulations to Isabel.

Mark Uraine: Congratulations.

Birgit Pauli-Haack: The main focus for this release are improvements on the navigation screen and the Query Block, she wrote in her release notes. Let’s dive into more details. 

Features

First up, the Query Block. So Mark, what is a Query Block? You have been working on the design.

Mark Uraine: I’ve been spending a lot of time on the Query Block lately. It’s a block, basically, that will support the basic query parameters, exposing all relevant of parameters of AWP Query. So, that it can be used in any template that needs to render a list of queried items. 

And this is going through a lot of iterations right now. We have a good idea of what needs to be included, but this is going to be a base block, really, for builders of websites, right? That need to provide these queries on specific template pages. We’re going to extend out of it into block variations, that’ll help streamline the block’s purpose, because without a specific purpose, this Query Block can do everything that WordPress does. Because that’s what WordPress is, it’s a bunch of queried stuff. So with variation. So we hope to narrow it down, to make it a little more user friendly. Something that the latest post block can be built on. And we’re getting there. Lots of iterations right now.

Birgit Pauli-Haack: So a list of queried items. That’s a list of blocks or a list of posts or custom post types, if you have a custom post type books. You have how the list of books shows up. That would be going through the Query Block. If you have a custom post, that is teams, that would do that. And I can see that is very a powerful block, but it also will have its problems in terms of user understanding, what it does. So I’m glad to hear that it will merge into some block variations and block patterns. 

So this Query Block has now a search. So you can search a specific post. You can search specific categories, taxonomies, tags. It has full author support and can also support the sort order. It’s an add an order like ascending or descending or order by, instead of the alphabetical or the publishing date, which the normal order is, you could then change it to sort by alphabet or you can change it to sort by the oldest first. If you have a series of blog posts, that are all based on each other, and the latest actually needs to be the bottom part, because you read it from top to bottom.

Mark Uraine: Right, right.

Birgit Pauli-Haack: A friend of mine, he writes an Instagram novel, so to speak. I think it was in his 250th, yes. So if he wants to do that in a blog, he needs to put the next thing on the bottom of things. So, if somebody wants to read it from top to bottom.

Another feature was the Navigation screen got some more features. It added drag-and-drop to the list view. Well, a little side note here, the list view is the new name of the block navigator. It doesn’t show list view or something like that, but it’s the block navigator, where you see all the blocks in a list in the top toolbar in the info screen.

Mark Uraine: You’re right. And I think a good reason for that, was when we had the block navigator as part of the Navigation block, everything just blew up. So we managed to change the name and now we all know what we’re talking about.

Birgit Pauli-Haack: Good. Glad you also let the users know. So it has this drag-and-drop to the list view implement redesign of the screen and add support for advanced menu item properties. 

Enhancements

This release, Gutenberg 9.0, also has a few enhancements and a lot of people will say, “Yes,” to the next one. That’s drag-and-drop coming back visibly into the block toolbar. And it has the little dots again and it’s between the transformer and the alignment. So it’s where you want it. So you don’t miss it every time or just move the block, but not drag-and-drop it.

Mark Uraine: And I was just going to add, those three elements have now become back together again in their own part within the toolbar. So it’s done very nicely, I think and solves a lot of the issues that people were having.

Birgit Pauli-Haack: Absolutely. I think it was an experiment that proved to be, “Okay, we know now what the user wants.”

Mark Uraine: Right.

Birgit Pauli-Haack: Drag-and-drop is important.

Mark Uraine: And we pivoted. We changed it, maybe not pivoted, but we adapted and brought it back. We listened.

Birgit Pauli-Haack: Wonderful. Thank you. 

So the enhancement is also the block variations, that you saw in the side bar for multiple features like the image block, you could see the circle style or other styles on it. Or for the quote or for the separator, they were in the sidebar, two or three different variations how you could use them. Those show up now in the inserter, instead of the sidebar. It’s going to be interesting how people like that. That’s definitely something, that I have no idea, but it makes sense that it’s there. What’s the difference?

Mark Uraine: I feel like they’re a little more hidden now, but yet, they’re more related to the thing that they need to relate to. So I’m interested to hear any feedback on that.

Birgit Pauli-Haack: And talk about the list view, remember that’s the former block navigator, has some styling improvements, it’s on the info. We talked about it, that there is another character count in the intro screen as well. That was in the last release. 

One enhancement is also, to limit the block slash inserter to nine items to select from and show the most used by default. That was a problem and you have multiple plugins, that have quite a few blocks in there and each of the blocks reacts to all the keywords that you put in. Then you have a list of 15 blocks and then, the most important one is in between there and that is also an improvement, an enhancement, in this release, that the search algorithm has been improved as well for blocks as well as for block patterns. That’s something in the background of things. You don’t realize it until you know, “I’m getting to my things faster now.” So I really appreciate that. Then, allow sharp gradients. I always like the gradients, but I don’t know why they need to be sharper. So you have two colors next to each other and they are… Anyhow.

Mark Uraine: Because a sharp transition between one color to the other. Yeah, sharp edge.

Birgit Pauli-Haack: That gives you quite a few additional design elements.

Mark Uraine: Right. One of the cool things is you put an image in there and you want the background, your site is white and you have the top gradient white into a color and it’s sharp color and then out to a white again. So you have your gradient that has the color, smaller than the image that you have overlaying it and it’s a cool effect, that way. You can do really creative things and I’m so glad that was introduced.

Birgit Pauli-Haack: I can spend hours doing that.

Mark Uraine: Of course, you can. It’s gradients.

Birgit Pauli-Haack: It’s gradients. Yes.

Mark Uraine: Who wouldn’t spend hours doing this?

Birgit Pauli-Haack: One enhancement, that is definitely helpful for those who have galleries in there. So it reads, “Let ID-less gallery shortcodes fall to Shortcode block, instead of the gallery and then display it from there.” I don’t know exactly when that happens, but it’s probably when the galleries came from a different feature, out of a plugin and through a gallery block or feature of core, because then, through the short code, the plugin that created the gallery can then also do the rendering of that gallery. It’s not a disconnect for the display of the galleries and who’s handling what kind of thing handover.

Mark Uraine: Mm-hmm.

Birgit Pauli-Haack: And then, another enhancement is to allow inserting an h1 using 1# + space into a post or page.

Mark Uraine: What? So this is markdown, right?

Birgit Pauli-Haack: This is markdown. So the block editor, heading block doesn’t allow you to put h1 in there, because it is opinionated about that the title needs to be h1. But if you want to have a theme, that doesn’t handle the cover block well, then you could but you want to have hearer image on top of the page. Then, you put the heading into the cover block and then you need to be able to make it an h1, for instance. I like that, that’s now possible. At least, with markdown, a notation to put an h1 in there and not to get carried away with that. Because that’s just a really an edge case. But some people really wanted to do that and they couldn’t they had to have the HTML of that.

Mark Uraine: Mm-hmm.

Birgit Pauli-Haack: So the Widgets screen, the next one is the Widgets screen, now has a plugin area and that’s a separate area where plugins can put their widgets in that space. Is that true? I haven’t tested it.

Mark Uraine: I’m looking at this one. I’m actually not familiar with it.

Birgit Pauli-Haack: So to separate the core widgets from the plugins, I’m not quite sure.

Mark Uraine: I don’t see any screen. It’s says it’s a first step to finding Widgets screen admin location via Slotville.

Birgit Pauli-Haack: So plugins can add additional widget areas there and then also use the plug editor to bring them in. I think those are hopes and whatever.

Mark Uraine: That’s what they’re looking like right now.

Birgit Pauli-Haack: But it’s definitely worth looking at. 

Now, we also have, as another enhancement, Transform multiple heading blocks to a list or paragraphs, that wasn’t possible. You needed to go to one heading at a time to convert them to paragraphs. Now, you can highlight all the heading blocks and make them a list or a paragraph. So that is the start of multi-block editing, which has been missing for two and a half years, or three. Three and a half.

Mark Uraine: It’s a part of Global styles almost, except is not as global. You have just this few selected blocks that you’re able to transform, but good.

Birgit Pauli-Haack: It’s the testing and then see what’s the same and then manage the difference. When you’re in inner blocks, you were sometimes faced with having multiple empty blocks in there and they were trailing inserters for nested blocks, and I don’t know if that was the problem. Those inner blocks reacted a little bit differently.

Mark Uraine: I think it’s just these multiple inserter, these plus icons everywhere. So it’s helped clean them up a bit.

Birgit Pauli-Haack: You couldn’t decide is that now for the columns block or is it outside the columns block, that’s also one of the things, that’s fixed. And Hooray, the Search block now has options to adjust the button, the label and the width of the search forum. So I’m really happy about that. It adds some flexibility to it. 

Mark Uraine: Mm-hmm. A lot of icons were created for that one too. We got into the Figma library as well.

Birgit Pauli-Haack: And the next one is, display labels instead of icons in top toolbar. Now, that was quite some time coming.

Mark Uraine: I would’ve done that one a little.

Birgit Pauli-Haack: That was quite some time coming and with one line in the release note, it doesn’t really relay how much iteration went in there.

Mark Uraine: Oh, my goodness, it featured only….

Birgit Pauli-Haack: I counted. It was 63 comments. 29 commits. I think it was actually Isabel. It was 28 file changes or files changed. Sorry. So if you ever feel the need to learn how much work it takes to get an halfway decent UI working, well, a lot of people agree this is an excellent PR to read.

Mark Uraine: Even, the issue associated with this PR, which was initially worked up by Nicholad, I believe, and all those commits that you are saying, half of them are me saying, “Oh, can you just move the button two pixels to the left a little bit.” That’s the brunt, it seems like, of all this. Was just trying to get the spacing right with some of this and how the drop downs worked. All the developers involved Isabel, Nicholad, they really put in a lot of good time on this and came through. And it’s actually very nicely done. So test it out.

Birgit Pauli-Haack: And the next enhancement is, following the rule with every new feature, you also create a feature to reverse it. So that’s the option to show the icon labels again and bring them back at the top toolbar, because that is definitely a personal preference, that can go either way. It’s a good solution and I like it. So you can arrange your own workspace as you need it. 

And the last of the enhancements that I really wanted to shine a light on is the reinstall button when a block type is not found in the block directory, in the inserter. Sometimes, you played around with blocks and maybe, you also looked at the plugins and said, “Oh, I don’t need that.” And delete it and all of a sudden it comes back. You go on a post, where that was used, then you get the notification or the error message, “There was an unexpected error. This block is not available anymore, and do you want to try and save it or just change the custom HTML.” Now, it will have a button that says, “Why don’t you reinstall it.”

Mark Uraine: How cool.

Birgit Pauli-Haack: That’s really cool. It does not work for the block suite, the block collections block, it only works for single block plugins, as the whole block directory process works.

Mark Uraine: Those ones are so valuable to have, because those are the moments, we’re like, “Oh crap. What’s going to happen right now?” And it’s a nice little button that, “Oh, good. Okay. I can reinstall this.”

Birgit Pauli-Haack: Bring it back. Bring it back. So there was some great enhancements in there and then we had 26 enhancements, eight new features. So that’s quite a release, but we are not done yet.

Bug Fixes

Mark Uraine: There were also 32 bug fixes in 9.0 here. Several of them had to do with full site editing. There were a couple of the classic block, the Embed block and even some into the new screens, that aren’t even released yet. Their bug fixes getting in already, the Global Styles interface, the Widgets screen, the Navigation screen, all getting bug fixes, which are showing that. We’re trying things out and still breaking things and getting fixes in there, before we share everything with everybody.

Birgit Pauli-Haack: Well, the Widgets screen is released.

Mark Uraine: Yes, this is true. This is true. Oh, goodness. And then, there was one on polishing up the horizontal movers, helping to improve that block movers horizontally, showing external icons on the help button.

Birgit Pauli-Haack: I like that, that is in there. Just for people to know it’s going out, but it’s also pointing to the official documentation on wordpress.org about the block editors. People are introduced to that, when they need some more help and now they get it. We have definitely added seven to eight new pages, brought about 30 pages up to 5.5.

Mark Uraine: It’s so important for the software to actually link off to the documentation. It’s great to have that though. I actually like that, because it gives that user a quick way to get to the resources they need.

Birgit Pauli-Haack: I think there would be a few additional question marks and what do I do here, throughout the editor that doesn’t go off the site, but having that, having another tab or even another window open with the documentation, definitely helps for newcomers.

Mark Uraine: The other bug fix that I wanted to talk about was the Image Block. Now, properly shows errors on drag and dropping images to the side of it. 

Experiments

And that brings us to experiments. There are 13 of those PR’s merged. First one being, the group block added padding support. So there are now settingS, that control the padding on the group block. You need to have a theme that has theme support for this, but it is an experiment. If you have a theme that can do that, you can check it out.

Birgit Pauli-Haack: I definitely will check that out, because we stumbled over that. I was wondering if you need to do an overall CSS for the group block or is there something coming with the block editor. And I like that that’s now…. It’s experimental. So it might not be future proof. I definitely want to point that out, but I’m really happy about that.

Mark Uraine: I really think that experimentation is going to bleed into the other blocks as well. So the more feedback we can get around that, then we know how to bring that little feature into other blocks, that it would really be helpful for. The other experiment, there’s several around controlling the block editor via the theme.json file. So many different supports in there, like adding for custom link color, custom spacing, etc. Global styles also saw a few experiments added. Those being, the sidebar and edit screen. The page edit, I believe, they’re the site edit screen, print minified CSS and some other one.

Birgit Pauli-Haack: So Gutenberg 9.0 is the first release that actually comes with OI support for the Global styles and theme styles. So really switch on the experiment FSE. I think, it’s the post site editing, that you have to switch on to be able to see the sidebar in that site editor and to adjust some of the settings for your theme. Of course, you need also a theme that reacts to that and I think the Gutenberg Starter theme has now some features for that. I might be wrong. I’ll check it.

Mark Uraine: We’ll have to double check. I remember seeing PRs for it on the theme, but I wasn’t sure if they were merged or not.

Documentation

Birgit Pauli-Haack: And the next section of the release notes, documentation and a big shout out for Justin Ahinon, he had added to the developer documentation readme files to the block editor components. And a readme is needed for the components. And to do that, you add a file to the component folder, copy some existing readme file and then, base template. So if you want to contribute to that, there are some instructions there, but Justin is also the team rep for the developer documentation. But he right now, needs a few more people to help him with that and that’s certainly something that would be very, very impactful for other developers. 

And he, himself, added the readme files for 10 blocks, the Ungroup component for 10 components, the AlignmentMatrixControl, the preview options, block types, list component, inspector component, the variation picker component, parent selector component, which is interesting. I don’t know if you saw, but when you hover over your transformer, you get another little icon pop up and that’s your parent block. The BlockCard component readme’s.

Mark Uraine: Wow, Justin. Thank you. 

Birgit Pauli-Haack: He really went to town with that.

Mark Uraine: That’s tedious work, right? He really got to look through everything, document it all, make sure you’re covering all the basis. Really good.

Birgit Pauli-Haack: So update documentation. A great way to contribute to the project and learn quite a great deal about how everything works. It also gets you started with the pull request process, which can be a little bit daunting for the first time, but we will have the link to how to contribute to the documentation settings in the show notes. So you can study that and have your questions answered in the docs channel, that’s where it all resides. 

Code Quality

There were also some code quality items, PRs, in this release and some of them had to do with the Api-fetch, as well as the data and the Block Directory. And also to make sure that it consistently supports different PHP versions.

Build Tooling and Various

Mark Uraine: Cool. We had one, specifically, one PR merge for the build tooling, the Env update docker volumes during wp-env start command. Then, there were a few various merges as well. One around using WordPress menu API and then, removing the embeds for Facebook and Instagram. Birgit, do you have anything to say about that?

Birgit Pauli-Haack: I think, I said everything in the post, but….

Mark Uraine: You’re commenting about your post on Gutenberg Times.

Birgit Pauli-Haack: On the Gutenberg Times. So the issue is that Facebook announced in August that they will switch of the open oEmbed publishing from their site. So you could just use a link in the classic editor and it pulls the post or the image into your post, into your article. And that will be turned off in October 25. So the block, as they are working now, have been removed in Gutenberg 9.0. So all the existing ones, still work until Facebook switches it off. And so, it’s almost like a website that you link to and they reorganize the link schema and all of a sudden your link goes dead. That’s the open rep and the publisher can decide what they want to do with their own site. So how will that affect your Legacy Embeds? Since two years you have been adding Facebook Embeds or Instagram Embeds for your website, what will happen is that those broken Embeds will just show the link to the post or to the picture. So if people read it and they don’t click on that, then there’s an image behind it. It will also apply to Instagram Embeds.

Is there a way that WordPress could assist? There was a discussion, actually, at the DefChat this week about it. It’s, “Yeah, we can’t really do anything against it.” I know that people on the core development team have reached out to Facebook, but that seems to be a done policy. They are moving away from it. 

So there is a plugin in the plugin repository. So that the Embeds work, you as a blogger or as a publisher, you would need to register with Facebook as a developer and you need to add an app that specifically is allowed to use the oEmbed code and then it will work again. But not a whole lot of users are going to do this, but that’s pretty much what you have to do. So it doesn’t go on kapooy. What you use. And there is an oEmbed plus plugin in the repository, that lets you just add the app ID and the secret for the app and then it will take care of the Legacy oEmbeds on your site, at least that’s what Ayesh does. So I will have the link to that post in the show notes and Sarah Gooding on the WTavern also wrote about that.

She has a lot more background about what oEmbed is and who’s behind it. But it’s pretty much something that you as a site owner or you as an agency, personal implementer need to warn your clients about. That, that is coming.

Mark Uraine: That’ll affect a lot of people. A lot of sites.

Birgit Pauli-Haack: Definitely, because a lot of people just shared some Facebook posts and had a whole article about it, where their own writing was maybe a 100 words and the rest was filled from the other space. 

So in the DefChat, there will be a call for comments out on how core should handle that and to alert the user that that is coming. I don’t have an idea yet how that would work, but I think the whole community can put their heads together and come up with a good solution that uses the next release, actually, and warn people that they need to go through their old posts and see what happened. 

Active Development

So we’re now into the section, what says, an active development or what’s discussed.

Mark Uraine: So that covered the release, that was 9.0. All right.

Birgit Pauli-Haack: That was 9.0 and that’s all. Test it out. Go and use all the great new features.

Mark Uraine: There’s lots of enhancements. You know what I noticed there wasn’t, at least not in our notes right now, what was the performance? Was there an improvement to performance? Nothing.

Birgit Pauli-Haack: That wasn’t in the release notes.

Mark Uraine: I was curious. I’m always curious about that one.

Birgit Pauli-Haack: I think when we get closer to pull merge in October or end of September with the next releases, we will get some updates on that. So for the next section, I want to start that there are just announcing that there are project boards. Project boards are something where all the issues for a certain thing … let me put it this way, either for release or for certain feature. So you can see how it’s progressing and it’s more can ban board in GitHub. Even though there is a project board for 5.6 just for the Gutenberg development, but that will alert us all to see what will make it into the release, especially, they’re all supposed to be coming, the navigation editor, the widget editor in 5.6, and we also have the project boards for those in the show notes. So you can say, “Okay, I want to see what’s happening in with the navigation editor or the widget editor.” And see it all on one place. See it all in columns, but it’s all in one place. You don’t have to go through the whole issue and PR list.

Mark Uraine: And watching that 5.6 board will help us, not only see what’s getting in, but what might be lagging. So where we need to get more support.

Birgit Pauli-Haack: Yes, and it’s coming up. It’s 9.0. I think 9.4 also.

Mark Uraine: It’s coming up quick.

Birgit Pauli-Haack: We’re supposed to get into.

Mark Uraine: Getting all this stuff down. So Adam Zolinsky has several updates to the widgets editor as well. He’s been working on and PR’s one, is fixing the global inserter in the widgets editor. There’s also just trying to get that panel to fit right or function correctly. And there’s even, if you have more than one widget area that’s visible … I’ve been working on trying to figure out the flow for how do you get the block from the panel into the correct widget area, if nothing is selected, right?

Birgit Pauli-Haack: Right.

Mark Uraine: It’s much easier if you have the area selected or a block in the area selected and then you’re adding it. The system knows, “Okay, we’ll add it, where you’re at.” But with nothing selected, it’s like, “Where’s that block going to go?” So, we’re working through some of that. There’s also moving the legacy widget block to the edit widget package, so it becomes more related to the widget editor, rather than the post editor. Is that right?

Birgit Pauli-Haack: Yeah. That would help, because then surface blocks will also be able to use the sidebar, which sometimes doesn’t happen yet. But those are legacy widgets. So that whole legacy widget thing, that was supposed to or not supposed to … that we talked about last episode, that hasn’t changed yet. That has landed yet, the changes that are coming there, but it’s going to be much easier to use then it is now.

Mark Uraine: And the other one there, that I wanted to comment on was, now working on registering widgets as block variations. Talked about that earlier, about the Query Block having block variations. Well, the widgets, third-party widgets, will essentially be a variation of the legacy widget block. And so, adding them into the widget area will be very smooth and work just like you would be adding a block into that area.

Birgit Pauli-Haack: Do you know that there’s also a movement to add also block patterns, widget block patterns to the inserter for the widgets?

Mark Uraine: Right, right. And I think that was also brought up by Justin Tadlock as well.

Birgit Pauli-Haack: Mm-hmm.

Mark Uraine: And I see no problem. Let’s have those in, if they’re useful and helpful and people can work with those, let’s definitely do it.

Birgit Pauli-Haack: So is there a way to make blocks just be for the widget area or there are blocks for both? Do they have to be both? Is there a flag in the block?

Mark Uraine: I don’t think there’s a flag. I’d assume that, if you were creating a block in your plugin that it would just be available either/or. Or both. It would be available in the post editor and in the widget editor as well. That’s a good question, though. Maybe, there’s certain scenarios and you really only want these things to show up in widget areas.

Birgit Pauli-Haack: Well, from the block patterns, they need to match whatever the footer is or if you put them in the footer, they have a different design in the footer, than they would have in the post.

Mark Uraine: So that would be more relevant for the patterns you’re seeking.

Birgit Pauli-Haack: All right. So Andres shared in the meeting also that there has been great updates to the Global styles and there has been some momentum around the block project lately, with Harque, Riad, Andres and others working on it. And so, there has been a reorganization of the theme.json to better clarify the purposes and important changes to the global styles and experimental theme.json is coming to Gutenberg 9.1. So we will see it in two weeks and we will have the reference for it to the PR. But that bears the question, heard it multiple times today, from the release and now too, what is the theme.json?

Mark Uraine: Glad you asked. So it is or will be a way to set default styles for blocks. It creates presets for a new set of editor controls, that changes all copies of a block at once and it creates CSS variables for the actual styles.

Birgit Pauli-Haack: That’s pretty cool.

Mark Uraine: And most of the, add theme supports, have been ported to the theme.json file. Allowing themes to have more fine, grain control over those features.

Birgit Pauli-Haack: And also you’re keeping it in one set. So you only have to go to one file to figure out, “Okay, where do I change the setting?”

Mark Uraine: Really good point.

Birgit Pauli-Haack: I saw that the functions PHP sometimes has, depending on which, is it one year ago or is it this year, where the theme support for disabling colors. And so, it was a little bit of a mess, what I saw. But that is more the story of me as a developer, than anything that the Gutenberg team can do. Right? Well, I’m glad that they are helping me with keeping it all in one file.

Mark Uraine: How nice of them.

Birgit Pauli-Haack: There was also a question in the core editor channel, I wanted to pick up, because I think some of our U.S. users might be interested in that. 

So the situation is, if you want to test something, you use the release candidate or the stable version, but what if it was already fixed in master and you want to test it from there. Can you get a copy of the master as a plugin working? And Carolina Nymark had that question and Ari Stathopolus. He had a nice setup there and I wanted to share that with you. So he has two versions of the plugin installed. He has the master branch in a folder called Gutenberg Git and then installs the Gutenberg plugin in the normal way, in the Gutenberg folder. 

And from that point on, he only needs to activate and deactivate in the plugins page, which one he wants to test or use for a certain use-case or a test case. And then, whenever he sees a new commit on some of the things, he goes into the directory of the Gutenberg dash Git and there’s a Git pull and NPM run build command in the command line. And so you don’t need any automation for that. It’s not easy, but it’s simple. Now, you have two plugins that do the same thing, but you can deactivate it. They will run into each other. There’s an error message, that says fatal error.

Mark Uraine: If you’re having both active, right?

Birgit Pauli-Haack: When you have them both active. Sometimes that happens when I install the release candidate in a site, where the good plugin, “Oh, I remember you. Let me just deactivate the plugin.” But I’m thinking about even more approachable and I’m not done thinking. Approachable method to test from master and I haven’t had a … because you need to have Jest installed and for the first time, when you run master, you need to do the NPM install, that installs all the Jest modules and then you need to do an NPM build. That scares a few people away. You of course, need a local development environment or a WordPress environment. I think I have two or three instances of local WP on my computer or you can use Desktop Server, which is also very nice for a local environment, where you can just spin up multiple sites. And that would make it easier, if you have one site that tests Gutenberg master and the other one tests just the release candidates or the stable cell. Well, let’s keep thinking about this, because I know full site editing testing group will have to get started soon.

Mark Uraine: They’ll need some ways to set that up.

Birgit Pauli-Haack: Well, but this bring us to the end of this and if you have, dear listeners, any suggestions on that, feel free to comment on the show notes here or just ping us on Twitter, @guttenbergtimes and then, as always, the show notes will be published on the gutenbergtimes.com/podcast. And just go down to the episode. This is episode 29. And if you have questions or suggestions or news you want us to include, send them to changelog@gutenbergtimes.com. That’s changelog@gutenbergtimes.com. So that’s it. Thanks for listening and until the next time. Good-bye.

Mark Uraine: Thank you so much, Birgit.

Birgit Pauli-Haack: Thank you.

Sponsored by Pauli Systems