Ryan Welcher and Birgit Pauli-Haack discuss the new developer blog’s public beta, Gutenberg 14.5 and 14.6, and what’s in the works for the block editor.
Connect with Ryan Welcher
- Twitch Streams: RyanWelcherCodes
- YouTube Channel: Ryan Welcher Codes
- Twitter: @ryanwelcher
- WordPress Make Slack: @welcher
- GitHub: @ryanwelcher
WordPress Developer Blog
- WordPress Developer Blog is in public beta
- Welcome to the WordPress Developer Blog by Josepha Haden Chomphosy
- Demystifying Home and Posts Templates in WordPress theme development by Daisy Olsen
- Creating Themes from a Pattern-First Mindset by Justin Tadlock
- How to extend WordPress via the SlotFill system by Ryan Welcher
- WordPress 6.1.1 Maintenance Release
- WordPress 6.1 “Misha”
- Woo Commerce Blocks
- WooCommerce Blocks 9.0.0 Release Notes
- What’s new in Gutenberg 14.5? (9 November)
- What’s new in Gutenberg 14.6? (23 November)
- Gutenberg 14.5 Introduces New “Document Overview” Panel, Improves Block Spacing Controls
What’s in active development or discussed
- Design Concepts on the new brows mode
- Template Parts: Add an option to import widgets from the sidebars
- Global Styles/Typography: Managing font sets
- Make it possible to push local block styles to global block styles.
- Pre-publish: suggest uploading external images
- Sidebar: Split block tools into menu, settings, and appearance tabs
Stay in Touch
Birgit Pauli-Haack: Hello and welcome to our 76th episode of the Gutenberg Changelog podcast. In today’s episode, we will talk about the new Developer Blog Public Beta, Gutenberg 14.5, 14.6 and what’s in the work on for the Block Editor. I’m Birgit Pauli-Haack, curator at the Gutenberg Times and WordPress developer advocate. And I’m thrilled that my friend, Ryan Welcher, core contributor, livestream on Twitch and developer advocate joined me today. Again, yeah, you’ve been on the show before. Good afternoon, Ryan. How are you?
Ryan Welcher: I’m good, Birgit. Thanks for having me again. I’m always excited to hang out with you and talk Gutenberg release notes and all this stuff. Yeah. I’m excited.
Birgit Pauli-Haack: We do to have you here. So yesterday, you had your weekly Twitch stream again. And you had a break of three weeks and you came back and so what was it about?
Ryan Welcher: Well, for the past two weeks… well, the first week back I spent trying to relearn how to use computers and the internet because it was three weeks off. I didn’t have a clue what I was doing. So the last couple of weeks, I’ve been focusing on Query Loop Block variations. So this week or yesterday, I actually started building a plugin that introduced controls to the Query Loop Block to be able to do more complicated and more advanced queries. And so I’ll probably be doing that for the next couple of streams and then hopefully releasing that into the wild for developers or anyone to use really. So yeah.
Birgit Pauli-Haack: Oh, that’s cool. Yeah.
Ryan Welcher: Yeah. You can check me out at RyanWelchercodes is my handle on Twitch. Every Thursday at 10:30 Eastern.
Birgit Pauli-Haack: And if you missed any of Ryan’s Twitch streams, they go silent on Twitch. But Ryan always makes the additional effort to put them up on your YouTube channel. That’s the same username, youtube.com/ryanwelchercodes.
Ryan Welcher: That’s right, yep.
Birgit Pauli-Haack: Yeah. And I always have to follow up because it’s really great stuff that you put out there and I learn so much about it.
Ryan Welcher: Oh, thank you.
Birgit Pauli-Haack: Not only how to do it well, but also to how to get to doing it well and see what you’re struggle with. And I’m really good-
Ryan Welcher: Yeah. 80% of my stream is me spelling things horribly and typoing like crazy and then not knowing why something’s broken. So, yeah, I have some viewers that are regulars that help me out all the time. Shout out to Kevin, he knows who he is. Cool.
Birgit Pauli-Haack: Awesome. Awesome. And we have a good show for you dear listeners today. And for the American listeners, it’s all happy Thanksgiving. And also I hope you have a great time on Black Friday and then serve on Monday. So I will be, over the weekend, at a cricket game tournament in Sarasota. And so we are doing this recording today and then I’m off to my weekend.
So we have a couple announcements that came in from project and one of we are all involved, you and I. That’s the WordPress Developer Blog is in public beta. And so it came out of discussion or year-long complaints or many years is that staying on top of the new features that are coming to WordPress. Open source is really one of the main barriers for developers to get started on the Block Editor, the site editor and doing stuff with it.
And the Core Block where most of the information is released has a very heavy emphasis for meeting nodes of the various core teams. And also it only highlights the new features that came with a major release. But for the Gutenberg plugin or what’s in the works on the PHP site, there is not a central place. It’s difficult for developers who are not contributors to get anything out of those make blogs as a relevant information. So the content will or focuses on the updates for developers, extenders who create plugins and themes and those who work with WordPress at an agency or as freelancers. And you were one of them working at an agency, also a free freelancer. So I really appreciate your continuing input on what is needed for agencies on the new features and how does it work there also.
So it’s really good that we have now a place where that information can be shared. And it’s in beta, so there are not a whole lot of posts there, but that’s definitely going to change next year. We have three posts there. One is Ryan’s post on how to extend the WordPress wire slot fill system. What is that about, Ryan?
Ryan Welcher: So a slot fill system is an extension paradigm that was introduced with the Block Editor with WordPress 5.0. And it’s a way of extending UIs, let’s put it that way. So you can inject your own elements into certain areas inside of the Block Editor and inside the site editor now. And, yeah, the article there is sort of preliminary. Sort of deep but not too deep. Deep enough to get started. And it’s based on a couple of talks that I’ve given in the past. So if you’re looking to extend the UI for the site editor or for the Block Editor, I’d go and take a look at that.
But, yeah, it’s kind of code heavy, but it’s one of the reasons why the Developer Blog, I think, is going to be so important because normally I would write this on my own personal blog. And now we have a central place where we can share this information, it’s sort of official, and people know where to go and they don’t have to know who I am or what my web address is or any of that stuff to be able to get the information that I’m trying to share.
Birgit Pauli-Haack: Yeah, that’s a very good point. Yeah, there’s a lot of information out there that’s decentralized and bringing them all in or bring the writers in. Daisy Olsen has a post and she demystifies the home and post templates for the WordPress theme development. It’s not necessarily focused on block themes, that’s pretty much… it shows you for classic themes as well as for block themes. And then Justin Tadlock has a post where he helps theme developers think about block theme development from a pattern first mindset to avoid redundancy in code and also to have some simplicity more in the theme development. And I think that all three of them are really excellent hosts there. So I’m so excited about this and I know a lot of people are to kind of see what comes out of that. Yeah, so check it out.
There’s also a page there that gives you a little bit more history about that and also a page that says how you can contribute if you want to be a writer or if you want to be a reviewer or you want to just kind of add your ideas to it, go there. And it’s mainly managed through GitHub so you get even an additional kind of insight in how GitHub works, even if you’re not so code centric and had always shied away. But believe me, it’s always a good place to be as a WordPress contributor.
Ryan Welcher: I just want to kind of reiterate what you’re saying about how anyone can write for the Developer Blog. It’s not gated in the sense of… there is a process and ideas and content may not be accepted, but that’s based on topic, not based on who’s contributing it. So I think it’s really important to understand that it’s not just for certain folks and it’s not just for contributors or whoever, it’s for whoever really wants to. And as long as you sort of adhere to the process, there’s no reason why I could say anybody wouldn’t be able to add content to the Developer Blog. It’s truly open source.
Birgit Pauli-Haack: And can also be reused because it’s going to be in public domain. So that’s the GPL part of it. Yeah. Another announcement came down the pipe, which is that core committer and Peter Wilson, and he’s also member of the security team, announced that WordPress will drop support for WordPress 3.7 and 4.0 on December 1st. And you might ask, “What? They’re still supporting that? I thought it was only the last two WordPress versions.” That is true. Officially, WordPress only supports the last two major versions, but the security team had always also applied security updates to previous versions from 3.7 to 6.03. They all got the same security updates. And that is to end.
So 3.7, 3.8, 3.9 and 4.0, they get one more update that will announce that there won’t be any future updates in the WP admin. So if you have these old versions in the stable of your clients, make sure that you upgrade to the later versions. I looked at the WordPress stats for that. So there is a stat online that gives you how many people are on which version on WordPress. And all four versions come together at 0.5% of WordPress installations. So, yeah, it’s a good decision. They wanted to do it last year but somehow it didn’t make it. Now it’s this year. So I just wanted to let everybody know the 3.7 to 4.0.
Ryan Welcher: It just amazes me that WordPress versions that far back still work. People are still able to run it and I just think that’s fantastic. You should update. If you’re running 3.7, you should update. There’s a lot of functionality that you’re missing out on, but it’s amazing that it still works.
Birgit Pauli-Haack: I wanted to look up when 3.7 was actually released and I think it was 2010 or something like that, but I can verify that. Maybe not. Yeah.
Ryan Welcher: March 14th, 2017? That makes sense?
Birgit Pauli-Haack: Oh, yeah. Could be. Could be. Yeah. Yeah. We are only at 3.0 or something.
Ryan Welcher: Sorry, I was looking at the wrong place. October 24th, 2013, version 3.7.
Birgit Pauli-Haack: Okay, thank you.
Ryan Welcher: Was named for Count Basie. Interesting.
Birgit Pauli-Haack: 2013. So that is a nine year old version, and nothing on your computer should be nine years old. And not on the survey either or be just accessible by the public on the internet. Yeah, for sure. Update.
So we’ll come to sections what’s released? And since the last show on October 30th recorded, we had two WordPress releases. One was a major release 6.1 and we talked about it. Yay. We talked about it quite a few times here and I definitely will share again the field guide link in the show notes. And then there was another release on November 15th for the 6.1.1. And it’s about roughly 50 bug fixes that didn’t make it in at 6.1 or came out after 6.1 was released. So that was a major effort from the release team 14 days after a major release to come up with a point release to get all the bug fixes in the hands of the WordPress users.
So there’s also a release from WooCommerce Blocks 9.0. Just for those who don’t know, WooCommerce Blocks is the bleeding edge plugin from WooCommerce similar to the Gutenberg plugin relates to the WordPress software. So using it, you can test all the future features coming to WooCommerce and help improve them before they’re actually released in WooCommerce. And the 9.0 the release came out this week. Actually today, and it’s November 25th, 2022. So they updated the options to customize products with an attribute template from the site editor, which sounds really cool. And then they improved the performance of product blocks by removing some fragments that were in there. And then they also cleared out some validation errors that were visible. A nice quality of life enhancement is that the placeholder for blocks who has placeholders… so the cover block, the image block, the gallery block, they all have placeholders that they take on the main store color coming from the theme JSON file. That’s kind of really nice. It’s, of course, an experimentation, but that is certainly something that any theme developer might want to look at how they implement that.
Ryan Welcher: Yeah, that’s really neat. I’d love to take a look and see. I’ve always been intrigued because I do a lot of block development, especially on my streams, and I’m always intrigued by how much can I interface? If I had a block that just didn’t matter where it was installed, if it could take on certain aspects of theme.JSON, I think that would be super neat. I mean I think some of that stuff just trickles down by default, but I’d be interested to take a deeper look at that.
Birgit Pauli-Haack: Yeah. In Gutenberg, there was also a feature where you can access the theme JSON through some hooks and filters in 6.1, but I’m not sure how robust that is.
Birgit Pauli-Haack: That will be for the, what did you say? The next couple of Twitch streams are still Query Block and then the third one from now.
Ryan Welcher: Yeah. It’s a great idea integrating… thinking about JSON into your blocks, using values from there to do things in a block, that’d be fun.
Birgit Pauli-Haack: Yeah. I think that makes whatever block in you have kind of very versatile and kind of migrates from theme to theme. But I also think that you probably need some standards as the naming convention on how you kind of primary, secondary, tertiary kind of colors. So I think as long as we don’t have them, it can be hit and miss. Yeah.
Ryan Welcher: Yeah. I mean as soon as it’s up to somebody naming something, that’s like what? The second hardest thing to do in computer and software development is naming things.
Birgit Pauli-Haack: What’s the hardest thing?
Ryan Welcher: Recursion I think.
Birgit Pauli-Haack: Okay.
Ryan Welcher: I can’t remember who said that. Somebody smarter than me anyway.
Birgit Pauli-Haack: Yeah. And, yeah, Gutenberg 4.5 was released on November 9th and we have a few enhancements there. It was not a very heavy release because everybody still came off of the November 1st 6.1 release and I’m still moving some stuff around.
There were some enhancement for Create Block for instance and I’m sure… you were, I think, involved in that to update to use the APIs. Yeah.
Ryan Welcher: Yep. So the Create Block package is near and dear to my heart. And this one actually allowed us to create… so backing up, when you use the Create Block package, you can also create external templates. And so those templates will define how your plugin is structured and how your block is structured. And part of that templating system, there’s a series of default values that you can pass. And so what this commit did was it allowed you to use the Render property because in 6.1, the block API introduced Render as a block.JSON property where you can pass the path to a file and that file will be used for dynamic blocks. It’s a PHP file.
And so what that did, that allows you to do away with having to call Render call back and defining a function when you’re registering a block. So it’s made block registration a lot easier, but we needed to update the Create Block package to be able to work with that system. As a template author, you can define what the name of that file is, where it lives and all those sort of things. So that’s what that did. That’s a long way of explaining it. Just caught one thing up to the other thing.
Birgit Pauli-Haack: Yeah, it was cool. That’s cool. Thank you so much. And we all need kind of a little bit more explanation about these things that are just one headline from… that’s what we are doing here at the podcast. So in the Style Engine, that’s kind of the engine that’s behind… that’s the black box behind the theme JSON file that kind of tries to manage all the user inputs, the block JSON attributes, the styles from the theme and the default style from the Block Editor. And nowadays, support the dimensions minimum height property. So you could have, for all kind of blocks, but it’s now available. And that’s really cool because then you can say, “Okay, my Core Block or my cover block has a certain minimum height to fill up and can also inherit that to the other blocks that are there.” Yeah. So it’s all cool.
Yeah. And then the comment template, post comment count, post comment form and post common links, they all got now also spacing support. So for your site editor and template. So you can actually… then here you can remove the spacer block and control it all with the blocks there. For another social icon, they got a new attribute and that’s the rel attribute, R-E-L, which is needed for something that’s happened on the rest outside of the WordPress universe, which is that Twitter had some implosion things coming on.
Ryan Welcher: Yeah, some stuff happened over there.
Birgit Pauli-Haack: Some stuff happened there. I don’t want to really belabor that, but if you want to… so the social link block now has a Mastodon block variation, but the Mastodon variation also lets you verify your website with your Mastodon account. So you can say or can prove, “Okay, I am the person who belongs to this website.” And it then gives you a check mark in the Mastodon profile. And George Hotelling, he’s a WordPress co con… what is it? A core contributor.
Ryan Welcher: That’s it.
Birgit Pauli-Haack: And he wrote a short tutorial on how to do this and verify your WordPress site with Mastodon. So if you have the need or wish or just want to check it out on Mastodon as a replacement for Twitter, a lot of people have registered Mastodon accounts since Elon Musk took over Twitter. And I think they are now on 2 million within a week, new accounts. So there’s definitely a wave there. And you can’t leave Twitter until you tell your followers where you will be. So it’s definitely a good way to at least get a Mastodon account and get it verified.
Ryan Welcher: I have to get a Mastodon account. Do you have one, Birgit? Do you have a Mastodon account?
Birgit Pauli-Haack: I have two, yes.
Ryan Welcher: You have two? Wow.
Birgit Pauli-Haack: I have one on-
Ryan Welcher: I’m always playing catch up with you. You’re so bleeding edge.
Birgit Pauli-Haack: Totally, totally.
Ryan Welcher: These new technology, not only do you have an account, you have two accounts and you’re the lead community contributor.
Birgit Pauli-Haack: Well, I looked at the Mastodon account and then my browser kind of said, “Oh, you have an account? Here’s your password.” I said, “Oh?” And then I looked at it-
Ryan Welcher: You’re an early adopter. Well before the Twitter nonsense.
Birgit Pauli-Haack: I looked at it and it was from 2017 and had not a single post and three followers.
Ryan Welcher: All right.
Birgit Pauli-Haack: So I pinned on my new account on my profile. So if you want to follow me or you have left Twitter and you want to kind of look at it and you want to connect with me again, do that. I also pinned my Tumblr account, which I set up in 2008 I guess.
Ryan Welcher: Yeah. I actually have a Tumblr account that I think I set up back when I was doing Flash development. That’s how long ago it was. So I need to get that updated.
Birgit Pauli-Haack: Yeah. Yeah. Okay. So now we got that out of the way. The second account that I have was the Gutenberg Times of course. Yeah. It’s a separate account. So if you don’t want the other things that I post on Twitter or on Mastodon, yeah. And WordPress only then the Gutenberg Times account on TWiT Social actually. TWiT is a long time podcast and live show technology podcast by Leo Laporte. And I have been following this week in Google Show, that’s the since, I don’t know, 10 years ago. And they have a Mastodon instance on their server. I like the name of it. It’s not Twitter but it’s TWiT. It’s not social. So I like that. And they also have an instance that is a little bit more moderated so it’s not anybody could come because they want to kind of keep the community tech oriented. So I think that’s a good place to be. But you can follow from any other Mastodon instance on the Gutenberg Times Stream there.
Ryan Welcher: Awesome.
Birgit Pauli-Haack: What else is in there?
Ryan Welcher: I think we were on post editor. Yeah.
Birgit Pauli-Haack: I highlighted that, a little piece there, is just to reiterate that there is a distraction free mode in Gutenberg plugin now that kind of hides all the interface items when you write or at all. So the toolbar on top, the side settings, but also the block toolbar that comes up or any other things that sometimes spring up and distract you from ‘what does it now’ want kind of thing. And now also the notices are now improved that come up on the edit post screen. For instance, the saving part and the transform part when you transform things and all that. That’s nicely improved.
Ryan Welcher: Yeah, it looks really nice on the screenshot that they have there.
Birgit Pauli-Haack: Yeah.
Ryan Welcher: The next one there is…
Birgit Pauli-Haack: Go ahead.
Ryan Welcher: So moving the document information into the outline deal, which is interesting to me. So if you want to know the word count and all that, you normally go up into the… there’s one of the buttons, I can’t remember what it was, what it looks like.
Yeah. It’s a little I or the info one. But now it’s been moved down to the bottom of the list view, which I don’t necessarily hate. This is the first I’ve seen this one, but I wonder is that an option or is that only in specific instances or is it always going to be there?
Birgit Pauli-Haack: That’s always right now. I think the last word hasn’t been spoken yet about that. It definitely needs some additional accessibility review and improvements and it also is missing some information. So I think the time to read comes up if your post is longer than a minute, then you get the time to read. And the number of blocks is, I think, mission. But you also get the outline as well. And that’s a little bit of a duplication between… so the outline is just the headers that are in your document and in the list view, you also see all the blocks that are in there. So it’s kind of a reduced… I like that the information is now just in one panel and it declutters the top toolbar because I’m sure we’re going to get additional information there.
Ryan Welcher: Almost guaranteed.
Birgit Pauli-Haack: Yeah. And I know that some plugins you signed as well. Yeah.
Ryan Welcher: Yeah. I would love to see this leverage the preferences. The preferences so a user can decide where they want that because that could be something that you… I can see use cases on both sides of it. I don’t care about it, I’m in distraction-free mode whatever. Or I just wanted to be able to be nice and quick because I have a word count that I’m trying to hit or something. So I can see that. I can see people loving this and handling this as with always the case with anytime we change anything. But I think it’s cool. It’s nice.
Birgit Pauli-Haack: Yeah. And I definitely wanted to mention it here because I heard from quite a few people that thought, “Oh, it’s missing now, what did I do?” Kind of thing. It’s actually hidden and there is no notification that, “Look here if you’re looking for that” kind of thing.
Ryan Welcher: Yeah, they used to do that a lot.
Birgit Pauli-Haack: And they haven’t done yet for this one.
Ryan Welcher: They used to have those little blue arrows. Do you remember that pre-Gutenberg days when something would move and all of a sudden there’d be a little blue arrow that says, “Hey, this thing’s over here now”? Yeah, it’d be cool if they did that again.
Birgit Pauli-Haack: Yeah. Do they have that feature or kind of the API for that in Gutenberg? I think that will be a good API to have.
Ryan Welcher: They have the modal that pops up the first time that you go into the Block Editor. That might be something to leverage when there’s an update that gets triggered again with like, “Hey, do you want to see what’s new?” And then everyone will hate it and turn it off. But it might be an interesting thing to leverage to kind of save people from trying to figure out where the heck something went or them feeling like they broke something and… anyways.
Birgit Pauli-Haack: No, I totally agree. I totally agree. There are quite a few apps that do this quite well that they have a little notification bell somewhere and they just change the color of it and you know there’s something new. So when you have time to browse that, yeah, you’re going to go there.
Ryan Welcher: Yeah. Especially something where you’re using-
Birgit Pauli-Haack: Does Twitch have that?
Ryan Welcher: Yeah, it does. And a lot of desktop apps will do that and stuff like that. So I think it’s a nice consideration for a user to be able to say, “Oh, hey. Something’s changed and you can opt into it.” So maybe just having it popped up is not the best way to doing it, but having some notification that shows up that says there’s been some changes to the UI, would you like to see what they are? I think that’d be kind of neat.
Birgit Pauli-Haack: And with all those changes coming…
Ryan Welcher: So you talk to your people about that and I’ll talk to my people about that. We’ll see what happens. Yeah.
Birgit Pauli-Haack: Yeah.
Ryan Welcher: Anyhow, what’s the next thing?
Birgit Pauli-Haack: What’s the next thing? Yeah, I’m kind of browsing past the bug fixes and I saw a headline that’s called Meta Boxes. And I was looking at that and the PR is that perform has Meta Boxes check on every safe which I really appreciate now because there have been very much quite some instances where I changed something in a Meta Box but I didn’t hit save. And then I went out there and that thing was also not updated, although all the Block Editor edits were updated. So it now does that in every auto save as well so you’re not losing any data from your Meta Boxes. Yeah.
Ryan Welcher: Now when you say Meta Boxes, are you saying… the first thing that comes to mind is register Meta Box in the original way that you’d do that. Is that what you’re talking about or just-
Birgit Pauli-Haack: Yeah. So the Meta Boxes on the bottom of a screen in the Block Editor like Yoast has them and newsletter…
Ryan Welcher: Stuff like that. Yeah.
Birgit Pauli-Haack: Yeah. And those boxes were not always saved unless you physically saved it. So the auto save would not catch up.
Ryan Welcher: Oh, that’s great. That’s so nice because that is horribly annoying when you’ve been messing around with stuff and then you navigate away, that doesn’t trigger the ‘are you sure’? And then you’ve lost your work. That’s nice. That’s really nice.
Birgit Pauli-Haack: Especially when you’re so accustomed to the every 15 seconds auto save kicks in and you don’t have to worry about it. All of a sudden you have to worry again. Yeah, it’s a little bit counterintuitive.
And then we come to the documentation section and there was one thing, that was the Storyboard intro. And the Storybook, not Storyboard, Storybook. Storybook is a tool that allows you to see each WordPress component from the Block Editor in isolation. And you see what values are in there, what action you can have there and you can kind of make some changes and then see how that happens. And this Storybook site didn’t have an intro page. You landed there and it says hello world. And so a few of us got together and updated it so you can learn more about it and also how to…
Ryan Welcher: Take the credit, Birgit. This was all you. You did this and some people helped. So props to you. It’s quite literally the definition of devral is making this easier to understand. I remember when I started first playing around with this Storybook instance, specifically I was like, “Why is it just say hello world?” And then it would fall off my radar. Yeah. So thank you. From the community, officially thanking you for doing this and making it better. So that’s great.
Birgit Pauli-Haack: Thank you.
Ryan Welcher: I actually used this tool today. It’s so helpful not only for reference guides, but, for example, WordPress icons. Way down the bottom of that list on the left hand side, you can see all of the available icons. And so I was working on that plugin today and I used it and it’s a handy dandy little tool to show you what’s available and you can see it in real time and see the different states of things. It’s very cool.
Birgit Pauli-Haack: Yeah. No, I think it improves development. Not only improves it but also speeds it up because you can go there and say, “So what is that component?” You can grab the example code and put it in your component and see how the first version looks. And so it’s really good. We’ll share the tool in the show notes of course so you can check it out yourself and see if you want to use it for your development.
And the other documentation issue that I wanted to highlight was that the curating the editor experience is a page in the Block Editor handbook. And that was updated with the content lock ability or the content only lock ability. So it’s a WordPress 6.1 new feature and I also link to the developer notes in the show notes. But it practically lets you lock down a pattern for instance. Just that the user only can change the content of the headline, but not the headline itself, the content of the paragraph or just upload a new image. But a block pattern itself stays as it is. So I think that is pretty far reaching because a lot of people build custom blocks because they wanted to lock down content and not have people or users kind of change things. And there is actually no need for that if you now with the content only blocks or patterns because now you just use a normal Core Blocks, a collection of Core Blocks and lock down the changing and only open up the content for that.
Ryan Welcher: Yeah, I think it’s super powerful. I know coming from the agency world, that was one thing that being able to stop people from creating every iteration of button color on the planet because you have to design for that and you have to count for that and stuff. So being able to just manage the content of something and leave everything else alone, I think, is going to help a lot of people. And this, sorry, explains it a little bit better.
Birgit Pauli-Haack: And, again, it speeds up building websites considerably if you don’t have to have a developer create your custom block to have that feature there. So really good.
Ryan Welcher: Sure.
Birgit Pauli-Haack: Yeah. So that was the Gutenberg 14.5. And without any further ado, we go to Gutenberg 14.6 that came out this week.
Oh we didn’t say 14.9, the release lead was Nick Diego and he also posted the release document. Gutenberg 14.6, Fabian Kagey, was the release lead and that was came out two days ago on Wednesday. And so, yeah, there are quite a few enhancements. Again, it’s a much richer plugin release than 14.5 was. And we have a few things that we wanted to point out. The first one is in the block library. So the navigation block is in major revamp just because you need more space to manage your menu.
And in 14.6, you now find that the navigation block has an added list view in the side bar and you can have more space to actually create your menu, select the menus, add a new link to a menu instead of doing it all in the small little space that you had next to the insert on the navigation block. So that’s definitely something to check out. And then also the navigation link. It now has a URL feed to the inspector control. So the inspector controls itself, you get a URL, you get names and all that additional features for your links and that is definitely useful. What else is in there?
Ryan Welcher: Make author block, select or display all users instead of just 10. I just looked at that. It’s not all users, it’s a hundred users. If you have more than 100 users on your site, you’re kind of a special use case anyways I would imagine. So that should encompass the majority of users, but that’s pretty nice. Yeah. I’m not sure the column address.
Birgit Pauli-Haack: Yeah, the columns block now has a transform that kind of unwraps the content. Meaning if you get it out of the columns into a normal… so if you have a head and image in a paragraph in a column and you look at unwrap the content, it comes out of the column and-
Ryan Welcher: Oh, that’s super handy. That’s super handy.
Birgit Pauli-Haack: Okay. I can’t figure out where I put this, but now I can kind of get it out of it.
Ryan Welcher: And, I mean, try to drag it out of columns and figure that all out. Just one button doesn’t make that way easier.
Birgit Pauli-Haack: Yeah. Yeah. Otherwise, you would have to drag and drop, for instance, three blocks instead of having a one button connection there. Yeah, yeah. You got it right. Yeah.
Ryan Welcher: That’s neat. Oh, and the next one, so the group block now has a variation picker in the placeholder. Which looks really, again, helpful being able to just choose the thing you want, the variation, in there, which is really handy.
Birgit Pauli-Haack: Yeah. And I like it that this surface the row and the stack variation right when you select the group block not only when you have it already on your canvas and then on the right hand side, you need to figure out the layouts of that. So, yeah, I really like that. Yeah.
Ryan Welcher: I think that that’s a quality of life thing right there. So you don’t have to insert the block and then get to the block and then go over to the right like what you’re saying. Just make this nice and easy. You want a row, you get a row. Two clicks, you’re done.
Birgit Pauli-Haack: Right. Yeah.
Ryan Welcher: Yeah. So the next one is under components, update the design of the focal point handle. What does that one look like? I think that’s… well, that’s nice. No, that’s nice. It’s like a little white circle with a little bit of opacity so you can see the stuff behind it. That’s super nice. I quite like that.
Birgit Pauli-Haack: Yeah.
Ryan Welcher: I love that people are actually taking the time and looking at these little… in a grand scheme WordPress, this is a tiny detail, but it just makes it that much nicer. It’s that little drop shadow, you can kind of see the image through it. I don’t know, that kind of stuff I’m always amazed because I don’t… I’m not a designer so I don’t look at things like that. If it was me, it’d be a big block, bright blue in there and it would look horrible but it would do the job. So it’s nice there’s this level of refinement happening to these existing tools.
Birgit Pauli-Haack: Yeah. A good job on the designers and they really figure out all the alignment like when they redesigned the whole setting section or the style section on a block where you have two things in one row, they’re all line up nicely. That was in a second iteration but they now have a standard how to do that. So it’s really good. And the next one is the same qua… it’s also a quality of life thing, but it also speeds up your writing. You can convert paragraphs to headings with a keyboard shortcut and the keyboard shortcut…
Ryan Welcher: Ctrl+Alt.
Birgit Pauli-Haack: Ctrl+Alt and then the number for the heading. So for H2, it’s Ctrl+Alt 2 and for three is… H3 is Ctrl+Alt.
Ryan Welcher: Yeah. If you’re on a Mac, I guess there’s options. So Ctrl+Options one to six.
Birgit Pauli-Haack: Ctrl+Options, yes. Yeah, yeah.
Ryan Welcher: Which is nice because I just learned that you can do that in Google Docs. So that’s a nice carryover here.
Birgit Pauli-Haack: Yeah, yeah. And I wish Google would carry over the paste.
Ryan Welcher: The link? Were you going to say the link?
Birgit Pauli-Haack: Link. Yeah.
Ryan Welcher: Yes. Why does Google Docs not have that?
Birgit Pauli-Haack: It trips me up every time. Every time I have a link on a Google, it kind of trips me up.
Ryan Welcher: Yeah, I know. And I just end up pasting over top of the text that I just wrote because I want put a link on it. Hey, Google. Hey, Google, if you’re listening. I’m going to trigger everyone’s Google Home now by saying that.
Birgit Pauli-Haack: Mine is downstairs so no problem with that.
Ryan Welcher: Yeah. Oh, mine just triggered. I have one in the garage here and it just triggered. It just said, “I can’t hear what you’re saying.” Anyways.
Birgit Pauli-Haack: Well, ours, when it kind of gets triggered from something on the TV, it responds back in German. It’s so funny.
Ryan Welcher: Oh, wow. Okay. Yeah. That’s funny.
Birgit Pauli-Haack: Yeah, the home devices. Yeah. Okay. And the next one is really the following, the change in vocabulary. We don’t say full site editor anymore, we do just site editor. And that, of course, needs to come through the whole interface and some other documentation. I think we will follow it quite a bit, but sooner or later we will all be there.
Ryan Welcher: Yeah. It’s the same thing as trying not to call the Block Editor Site Editor Gutenberg, because Gutenberg’s the name… it’s the codename of the project, right? I know I’m very guilty of it just using it as a catchall tool. So I think this is just a matter of leading by example and having people, maybe not correcting everyone, but just kind of using it.
Birgit Pauli-Haack: Yeah. Yeah. Exactly. Oh, we talked about the minimum height on the dimensions already, I think.
Ryan Welcher: I think we did. Yeah.
Birgit Pauli-Haack: Yeah. But there’s also another design tool change or update. So on the right hand side, do you have the dimension controls and the spacing for padding and margin controls? And you notice when you go and change it in the step scale that it has a little visualizer around the block that you are editing in blue. And now that process also will hide the toolbar. So you really can concentrate on that block that you’re trying to place pixel perfect into your canvas. So I really like the spacing visualizer because I can never figure out is margin new outside or inside or is that padding outside on inside? So the visualizer really helps you with that.
Ryan Welcher: That is really nice. Yeah. On the global styles, they have some elements of adding a tech text decoration control to link elements. That’s nice. Being able to manage that. Very cool. Blue typography, adjust font size, min and max rules. That’s great. These are all interface items. They’re all being added to-
Birgit Pauli-Haack: The theme JSON items.
Ryan Welcher: Yeah. But are they adding controls for them as well like the one for the text link?
Birgit Pauli-Haack: Well, the text … Yeah.
Ryan Welcher: Yeah. And I think some of these are sort of… the other one we were talking about, the min height I believe that was more about… the first thing we talked about was allowing it to work and the second one was giving a sort of a control and some tooling around that.
Birgit Pauli-Haack: And for fluid typography, I think they have started working on the interface or the user controls for it. But they’re right now only available through the theme JSON and they added minimum and maximum rules for the fun size. So you can actually change those, which was missing in 6.1 when the fluid topography came in the first time. And there is another global… so it’s also an attempt to see if you can generate random color palettes.
Ryan Welcher: Pretty neat.
Birgit Pauli-Haack: It’s pretty neat for those that are having a hard time with the design that you can give a color and then it gives you additional colors that match that or kind of go well with it.
Ryan Welcher: That’s super neat.
Birgit Pauli-Haack: Yeah. You don’t have to think about all the colors that you wanted to use. It’s really neat.
Ryan Welcher: Yeah, that’s really neat. I can just hear the agency folks going, “No.” But, yeah, being able to generate… that’s so neat. For someone like me who’s not a designer, who’s colorblind, being able to pick one color I like and then having sort of other complimentary colors generated for me, I think that’s really cool. It’s a really cool idea. Hopefully you can disable that for certain individuals or certain use cases I should say.
Birgit Pauli-Haack: I hope so too. It’s actually in the style variations. Those, you can shut down quite a bit. I’m just going through the PR and looking for ‘to disable this, do this’ but I haven’t found it yet, but I’m also just scrolling through some of them. But those, okay, disable things will never be in the first iteration of a feature because you need to be pretty firm on how a feature works before you can say, “Okay, and now we disable it.” But given the history of whatever happened before, I think there’s a good chance that that will be added. Yeah.
Ryan Welcher: Definitely. So some bug fixes there. Play board is in both front end and editor. Well, that seems like a good thing to do.
Birgit Pauli-Haack: Yeah, that bug has been fixed.
Ryan Welcher: That’s great.
Birgit Pauli-Haack: Yeah. And other than that, I… or the Block Editor. So the list view has been updated to disable the branch expansion when a block editing is locked. So if you are not allowed to edit it or if you’re not allowed to move it or remove it and you can only edit the content, then it will not expand in the list view either.
Ryan Welcher: Right. So an example would be you’ve got a group block that you’ve locked and so you can’t see any of the nested blocks in there. You can’t expand that tree to see that. I think that’s really smart. I think that’s really smart because there’s a way of getting around locking and why clutter up the list view if you can’t… if you’ve got 100 blocks in there, it’s a very complicated pattern. You’ve inserted it, but why mess up the list view with stuff you can’t even edit in the first place? That’s my opinion.
Birgit Pauli-Haack: Yeah, yeah. Then we have some experiments. We didn’t have a whole lot of experiments for a long time, but at the beginning of the Gutenberg development, there were a few experiments where developers wanted to just see how things work. And we are back to that. The navigation list view is actually an experiment. And then also inspector based navigation editing is also an experiment. So when you install the Gutenberg plugin, you need to go down to the menu where it says Gutenberg and then go to the experiments settings page and then enable those so you can test them. Yeah. What else?
Ryan Welcher: You want to move on the documentation?
Birgit Pauli-Haack: Yep.
Birgit Pauli-Haack: Well, thank you.
Ryan Welcher: Yeah. I mean it’s much more discoverable now and I think that’s great. That’s wonderful.
Birgit Pauli-Haack: And are you reorganized to create block documentation?
Ryan Welcher: Yeah, yeah, yeah. We added another subsection. One of the things in the handbook is we have that massive left hand navigation that has accordions in it. And so for some of these packages, they can get quite lengthy those sections. So a while back, we worked on having the DocGen tool… so the DocGen tool is what generates the docs, but then get ingested into the Block Editor handbook from the Gutenberg repository. So we were working on ways of having sort of nested pages underneath those sort of subsections. And so that’s part of what one had done here. It’s great that it splits out to the available commands and kind of organizes that content a little bit better so it’s a little bit more palatable. Because, as we all know, the documentation in WordPress, there’s a zero to 100 thing. Here’s the basics and then here’s everything else you could ever need to know about it all on the same page. And that’s just hard to ingest and it’s hard to kind of parse through.
So by doing this, and we’ll be doing this to some other packages as well, I have a pull request in place that I have to finish for the scripts package that does the same thing. That kind of breaks out some of the more complicated things, more advanced things into their own pages because for the majority of users, they don’t need that. They just need to know what commands are available, for example. So, yeah, that’s the motivation behind this.
Birgit Pauli-Haack: Yeah. I think it’s good kind of to go once in a while through documentation and do a little bit of an overhaul to update with the feedback from developers that have tried to insert information and say, “Okay. Well, it could be a little bit better.” So any improvement, you dear listeners, that you find or you couldn’t imagine, let us know on any places either WP Slack or a Twitter DM or on the Gutenberg Repo and we definitely are receptive to that and help out with making that happen.
Ryan Welcher: Absolutely. Many hands make light work.
Birgit Pauli-Haack: Many eyeballs, bugs are shallow. It’s the same with documentation. Yeah.
Ryan Welcher: Oh, okay. Yeah, totally.
Birgit Pauli-Haack: That’s great.
Ryan Welcher: Okay. So that’s all the documentation stuff we’re going to go through. And then what’s next? Code quality or patterns?
Birgit Pauli-Haack: No. I think we are done a certain… yeah. Well, there is a view call…
Ryan Welcher: There’s a few things bolded in the code quality ones, but I don’t know if that’s-
Birgit Pauli-Haack: I actually bolded them to do some more research on it, but I didn’t get to it.
Ryan Welcher: I mean most of these things like the color palette, color box, kind of border box polish and dry prop types add default values. This is just making it easier to use the rename to .TS is for type script I guess. Yeah. I don’t know if there’s anything you want to specifically call it.
Birgit Pauli-Haack: Yeah. No, I don’t think we… there’s one change in the pattern directory API that it now supports pagination parameters, but that’s for Gutenberg developers or for contributors that use type into the pattern directory.
Ryan Welcher: Oh, okay. Yeah.
Birgit Pauli-Haack: I don’t think it’s a public API. I wasn’t quite… oh, I think I was… yeah, I got the 401 kind of there not allowed, but I’m not quite sure.
Ryan Welcher: Yeah. It’s probably locked down. You probably have to be… well, no. Maybe. I don’t know. I have to look here. Anyways, it’s giving us pagination, which is great.
Birgit Pauli-Haack: Yeah. So if you wanted to have more than 30 blocks or something like that so … No, it’s a 404 not found. So it’s kind of-
Ryan Welcher: Okay. Yeah. So it’s locked down to somebody.
What in Active Development or Discussed
Birgit Pauli-Haack: Yeah, it’s locked down. All right, so that was the Gutenberg 14.6 release and now we are coming into section with what active development and discussions. And there are quite a few things that I find really, really exciting for the next iteration and I hope they make it all… there are still open PRs so you can test it. There is a different way how to test open PRs, but you get some great videos that demonstrate the features. So the first one is the design concepts for the browse method. So now that there are so many things that you can do in the site editor, the design team came up with how can we unify some of the interfaces. Some things are on the left column, some things are in the right column and can we have not all together, what about design?
And they have some nice ideas where the global styles will be taken out of the right hand side, put them on the left hand side, have a design sub menu for the site editor. Also have a template sub menu for the site editor, but it’s all in one place. It’s not kind of fragmented.
Ryan Welcher: Yeah. It’s really nice. I’m just kind of scrolling through some of the design items in the ticket there. It looks great. The transitions that they have going, I just think it’s going to be really nice.
Birgit Pauli-Haack: And there’s also a browse mode. So when you click on the templates or page template, you see all the page templates in thumbnails. But they’re relatively big depending on your screen, but you see how they kind of can change when you change the style variation as well. So there’s a lot more ‘what you see is what you get.’ And also kind of keeping a broader view on your site, especially when you do a lot of customizations on your templates to make it a little bit more consistent. Also show you things that are not consistent. So I think that really helps with the customization for site owners and those who actually build themes through the interface to have a better view on how this all looks.
So that’s one thing that I wanted to talk about. The other one is they’re working on a… and that’s more for the migration from classic themes to block themes that you can import widgets from the sidebar or that you’re using the sidebar that you can add them to block-based theme parts or template parts. And because the widget wasn’t available yet, there was a plugin available to add it to the site editor by Justin Tadlock called Classic Widgets. And this is the attempt to get it all into core, but that is definitely something to check out and see how that suits you. There’s not a whole lot of inter… yeah, there is a little video there on how to do that. So how it’s going to work, and I really like that.
Ryan Welcher: Yeah, this stuff’s so cool. It’s just amazing. I don’t know. That’s the stuff that they’re working on. I’m just like, “I don’t even know how to start that. I don’t even know how to build that.” But you all are doing a fantastic job doing all these cool things, so yeah. Glad I got out of development when I did because clearly I’m not qualified to do it anymore.
So, yeah, another thing that working on is actually managing the font sets for the global styles typography and how you can kind of make them available to more than one block or kind of have the settings. Okay, I want those… you cannot go to every block and change the font family. You need some more general places where you can just click on things and then that applies that particular font family to that series of blocks. So you can kind of get this a little bit better. But that is really hard. When I look at the interfaces and all the design interfaces, you get a good feeling how hard that actually is to make this palatable for non code users to put it in an interface that’s not crowded, that’s not give you a lot of cognitive overload.
Ryan Welcher: And isn’t developer jargon loaded. It’s hard to be able to communicate what a font face means or font weight. I know what that means as a developer, but if you’re not, then how do you explain how thick your letters are basically. It’s kind of how it is, right? Letter thickness. Maybe that’s how you do it. I don’t know. I’ll leave that to the professionals.
Birgit Pauli-Haack: Yeah. And I mean the other interfaces like the text editors or like the Google Docs that have some of it, but then there is such a granular control that a theme developer would need as well that it kind of can really overload the things. Yeah.
Ryan Welcher: For sure.
Birgit Pauli-Haack: And one feature I really like is that to make it possible that you push a local block style to the global styles. You say, “Oh, I like this block how it is and that post that I just wrote and I wish all my blocks, my paragraph blocks or my image blocks would look that way.” Now they’re working on it that you can push that to the global styles and then all of a sudden every…
Ryan Welcher: So like reusable blocks, but for styles kind of?
Birgit Pauli-Haack: For styles, yeah. Reuseable for styles kind of thing.
Ryan Welcher: Yeah. So anytime you insert a paragraph block, you’d have that style available to you even if it wasn’t defined as part of your theme. I think that’s super cool.
Birgit Pauli-Haack: Yeah, it’s super cool at the beginning when I think so. But if I think about, okay, how often do I change my mind? I said, “Oh, that could be really hard to kind of redo it.” Yeah, you want it on 15 blocks but not on 80 blocks kind of thing. Yeah.
Ryan Welcher: Yeah, yeah. That’s true. Maybe they’ll need an interface for editing those curated things where you edit the style and everything just gets automatically, but who knows? Who knows?
Birgit Pauli-Haack: Yeah.
Ryan Welcher: Sounds cool. Cool either way.
Birgit Pauli-Haack: You need to explore that and if you tested and use it and then all of a sudden you see what’s working and what’s not working. Yeah. Now the other two really exciting as well. Do you want to take the first one or?
Ryan Welcher: Is that the pre-published one?
Birgit Pauli-Haack: Mm-hmm.
Ryan Welcher: Yeah, so this one’s really cool. When you’re about to publish a post, if you have images that are external to the website. So if you imported a post from something and the URLs to your images are somewhere else, in the pre-published sidebar that says are you ready to publish, there’s a new panel being sort of suggested to be able to identify that you’ve got external images and give you the option to upload into your media library. I think that is such a handy thing. I know having done about a billion migrations that that’s a point of contention because it’s not easy to move those images programmatically. It can be done, but if you’ve imported stuff or copied and pasted and it’s there and you can just do it with a button, that’s so much simpler. I mean it’s not going to translate to doing 1000 posts all at once, but at least it’s such a nice feature. I think it’s so cool.
Birgit Pauli-Haack: Well, it’s only for that particular page, right?
Ryan Welcher: Yeah, yeah. Exactly. It’s not bulk uploading for the entire site, it’s for that specific page. Which I think is great. So cool.
Birgit Pauli-Haack: Yeah, I really like that. And there was always a restriction before. There was a button on each image block that said upload image, but that was kind of hit and miss as well. With Google Docs for instance, it worked, but it didn’t work with other WordPress sites or certain WordPress sites on certain servers. But Ella put some research on it and found how that can be consistently work better now with that tool as well. And there’s another PR open to copy that over to make that even better.
Ryan Welcher: Right. Yeah. I think it’s really nice. On the issue that I’m sure will be linked in the show notes, there’s a nice little graphical representation of what that looks like. It’s nice and slick and just seems super easy. Yeah. The next one is… this has been merged. It’s going to be the next version of Gutenberg I believe, but it’s an experimental feature that’s… so it’s an experiment on the experiment. In the sidebar, this is going to split block sidebar controls into tabs, which I think is super neat. So being able to define settings for a block and appearance or styles or whatever you want to call it in separate tabs. So that’s pretty exciting. As a block developer, I’m pretty excited about being able to do that because I know that that sidebar gets really… with really complicated blocks that are doing lots of things, that sidebar gets really tall. Really, really big and you have to have all your panels come in and they’re collapsed by default. But being able to split them out in into tabs will make that a much better experience I think.
I’m not sure about the technical implementation right now, but I would imagine though instead of just wrapping everything in inspector controls, you might have inspector control settings and inspector control appearance or whatever you want to call it. So, yeah, that’s something that I’m excited about is I nerd out about that kind of stuff.
Birgit Pauli-Haack: And I think it’s much easier also for a user to have that separate because sooner or later, you’re done with fiddling with the design of your site and now you’re putting content and you don’t have to touch those tires anymore or scroll past them all the time. So it’s really a good way to think about these things and put them in experiments so we all can experience them and kind of see what works and what doesn’t work out. Yeah.
Ryan Welcher: Yeah.
Birgit Pauli-Haack: I think what’s active in development is so exciting for me to look forward and I hope all of this makes it into 6.2. That’s the next major version and we don’t have a plan yet for 6.2 and I think sooner or later, it will come out. I know that Hector and some of the core contributors are working on it and figuring out what will be a good release.
It’s definitely going to be not in 2022, so it’ll be February or March of 2023. And maybe even before. Maybe not WordCamp Asia, but after WordCamp Asia. Yeah. Oh, speaking of which, what we haven’t announced yet is the State of the Word. That’s before the end of the show and we are all on the end of the show. The State of the Word will be happening in New York and on livestream on December 15th at 1:00 PM Eastern, that’s 5:00 PM UTC or 17:00 UTC… No, 1:00 PM Eastern is plus five, it’s 18:00 UTC and 17:00 Central European Time. And we share the announcement post to the State of the Word on the news section in the show notes, so you can all make your reservations. There’s also a form that you can apply to actually come to the event in New York. It’s, again, in the Automattic office like last year and the Automattic office and SOHO office in New York City in Manhattan. It’s going to be pretty cool. It’s scheduled for one hour and a half, and normally that’s kind of half an hour presentation by Matt Mullenweg and Josepha together. And then Q&A for another hour, both livestream and in-person. Yeah.
Ryan Welcher: Very cool. Nice. Exclusive.
Birgit Pauli-Haack: Well, it’s published already.
Ryan Welcher: Oh. Well, then it’s not that exclusive. I just haven’t seen it. It’s exclusive to me, I just haven’t seen it yet.
Birgit Pauli-Haack: Yeah. As always, the show notes will be published on gutenbergtimes.com/podcast. Well, it’s hard today. Published on the gutenbergtimes.com/podcast and this is episode 76. And if you have questions or suggestions or news that you want us to include, send them to firstname.lastname@example.org. Yes, that’s an email address and that’s email@example.com. So thank you so much, Ryan. It was wonderful to have you. Do you have anything that you want our listeners to know that you haven’t talked about yet or how can people reach you?
Ryan Welcher: Well, I don’t have any exclusive things to announce today, but you can find me online. I’m @RyanWelcher on Twitter. I am Welcher or Welcher Ryan or Ryan Welcher on basically every other piece of social media. My Twitch, you can check me out at RyanWelchercodes. And that’s the same name for my YouTube channel, which is also Ryan Welcher codes. And I think that’s probably it. But, yeah, I’d love to have everyone come and hang out with me on Thursdays 10:30 Eastern when I do my livestream. But thank you for having me, Birgit. I know. Love coming here and hanging out and talking to all this cool code stuff.
Birgit Pauli-Haack: Yeah. And it’s so wonderful to have you. Yeah. To talk through those things and have all your excitement for the Gutenberg developer. Custom development is such a nice addition to the Gutenberg Changelog. Thank you so much.
Ryan Welcher: Thank you for having me. Looking forward to the next one.
Birgit Pauli-Haack: Yeah, and this was it. Thank you all for listening. This is goodbye for me and talk to you the next time.