Gutenberg Changelog 116 – WordPress 6.8, Source of Truth, Field Guide, Gutenberg 20.5 and 20.6

Gutenberg Changelog 115- JC Palmes & Birgit Pauli-Haack
Gutenberg Changelog 116 Cover
Gutenberg Changelog
Gutenberg Changelog 116 - WordPress 6.8, Source of Truth, Field Guide, Gutenberg 20.5 and 20.6
Loading
/

Birgit Pauli-Haack and JC Palmes talked about WordPress 6.8, Source of Truth, Field Guide, Gutenberg 20.5 and 20.6.

Add a summary/excerpt here

Show Notes / Transcript

Show Notes

JC Palmes

Community Contributions

WordPress 6.8

Zoom Out: Disabled when show template disabled #69777

Gutenberg plugin releases

Stay in Touch

Transcript

Birgit Pauli-Haack: Welcome to our 116th episode of the Gutenberg Changelog Podcast. In today’s episode we will talk about WordPress 6.8, The Source of Truth, the Field Guide, Gutenberg 20.5 and Gutenberg 20.6, and a few other things, little things in between.

I’m your host, Birgit Pauli-Haack, curator at the Gutenberg Times, and a developer advocate working for Automattic. And it’s a great privilege for me to have with me, JC Palmes, who is the engineering manager at Web Dev Studios, again on the show. JC was also the local co-lead of this year’s WordCamp Asia in the Philippines, and it was a great WordCamp. So, congratulations. So glad you made it today, JC, how are you?

JC Palmes: I’m doing great. And, actually, my role changed since we’ve last had this. Yeah, so I’m now the principal technical manager at Web Dev Studios.

Birgit Pauli-Haack: Congratulations.

JC Palmes: Thank you. But yeah, I’m happy to be back. And things have been good, very busy, but the good kind. I’ve been deep in block themes again, so I’m excited about this episode. So, I’ve seen there’s a lot of cool stuff in 6.8 in the recent Gutenberg release I think developers like me will appreciate, especially those who are building for clients and working with starter themes.

Birgit Pauli-Haack: Yeah, absolutely. So, the first time you were on the show was last September in Episode 108, and you had just released the first version of the WSD, W-

JC Palmes: WDS-BT.

Birgit Pauli-Haack: … WDS-BT, yes, I’ll get it right, block starter theme, and we discussed it on the show. And after using it for half a year now, how are you doing with it, and what have you learned?

JC Palmes: Yeah, so it’s been a great journey since then. After six months, was it really just six months, of using and refining WDS-BT in real client projects, I’ve learned a lot about what engineers need from a starter theme, especially when working with the site editor.

And we’ve recently released Version 1.1, and most of the updates were based on feedback from our team, lessons from actual use in client sites, and one of the biggest things we focused on was making it easier to generate blocks and patterns consistently using our internal script, which is now part of BT as well.

So, it’s all documented in the README if any developers out there want to try it out. So, this really helps streamline development for everyone. And we also have a demo site so that clients and internal teams and Sales can preview how the theme behaves out of the block. It’s been really helpful for onboarding and for setting clear expectations early on.

Birgit Pauli-Haack: Yeah, I can imagine that, yes, and with the scripts now. So, you just said you had two scripts. One is to create custom blocks, and the other one to patterns. That’s the first time that I’ve heard about it. 

JC Palmes: Oh, sorry. Well, not… So, we have an internal script. So, BT is part of our other repo that helps us create a client site from scratch. And what that does is, there’s a script that I’ve added in where we can create a theme based on WDS-BT in five minutes, and it goes through all the process in the terminal, and then, after that, you have a full website theme working, a block theme working as is.

And the other one, which is part of BT, is in creating scaffolding blocks. So, BT comes with a block theme template that is baked into our custom webpack config. That webpack config is defaulting on WordPress config still, but we did add in a bit more flavor to it based on our use case.

Birgit Pauli-Haack: Oh, of course, yeah, that’s what it’s for, yeah, to adopt it, yeah. So, wonderful. So, dear listeners, we will share the links, one is to the theme, and also, to the demo site, in the show notes so you can test it out and see if it could also be your starter theme for your clients, and at least gives you…

JC Palmes: Yeah, that would be awesome.

Birgit Pauli-Haack: … and gives you some inspiration for that. And I’m always looking for inspiration about how people approach a topic, so I’m glad that you and your company share so much online and build it in public, and also, shared quite a few blog posts about it, not only about your theme, but also your approach on getting clients work from a classic theme, and then, gradually go block-based.

And I just listened to Brad Williams on the Press blog with Steve Birch. He interviewed him. So, I share that video as well in the show notes, and it starts out with what the approach is or how they approach it in terms of guiding clients through a block-based journey there when they were so happy with the other thing, yeah. And it starts at 20 minutes to get really into that. So, that was a really good conversation as well, with Steve Birch.

JC Palmes: Yeah.

Community Contributions

Birgit Pauli-Haack: So, we don’t have any announcement or listener questions today, but we have a few things that are community contributions or that I’ve selected, and one is pretty much the same topic. Kevin Devon and Mark Wilkinson from Highrise Digital, an agency in UK, shared their theme-building strategy for a school project at the London WordPress meetup.

And it was really insightful to see how these experienced theme creators use the site editor to build a theme, and then, let the client fully customize, also, their sites. They actually go pretty deep and show what block that they hide from the school, what block variations on the embeds that they hide, and how to do that. They even shared some code.

So, it was quite fast-paced, but video, you can just stop it and listen to it again, and all that. Yeah, so it’s called Building a Block-based WordPress Site with FSE. Yeah, they also went pretty detailed in what kind of custom blocks they did.

And they actually didn’t program them themselves, they used ACF because of the data entry screens as well. So, they only did two. The rest was all core stuff, yeah. So, it’s really cool to see how that works out.

JC Palmes: I’ll have to check it out.

Birgit Pauli-Haack: Yeah, they do some great work at Highrise Digital as well. And I have three more videos, so to speak, or tasks for you, dear listeners. So, three well-known developers in the community continue with their live streams. They started either this year or long before, but Jonathan Bossenger, many know from the developer courses at Learn WordPress, has been learning working with AI, and he shares it, be it wins or losses, on the live stream.

And this week he tried to find out, can AI fix my Plugin Check issues? So, Plugin Check is a plugin that you install on your site when you develop a plugin, and then run through all the checks that the plugin review team has built so you are ahead of the curve when you submit it to the WordPress repository.

But it’s not only good for when you submit it to the repository, it definitely helps you, also, with your own, even if you just give it to your clients also to beef up, check out some of the issues that are always problems.

Yeah, so I cannot say because that’s a secret. No, you need to check it out themselves, how good he was, how good it worked for him. And the second one is JuanMa Garrido, he is from Spain, and is also a developer advocate at Automattic, and he shared live stream sessions in Spanish and English, not at the same time, of course. 

JC Palmes: Okay.

Birgit Pauli-Haack: … me speaking Spanish, but no, he has one week he does this in Spanish, and the next week he does something else in English. So, that’s quite a good thing for the Spanish community as well.

And he recently livestreamed going through the Data Layers Course on Learn.WordPress and built the app in public, and goes through, not all lines of code, but he explains the concepts behind that, even…

Well, sometimes you need somebody to walk you through things so it actually clicks in your mind a bit, and that’s what JuanMa Garrido did. And then, Ryan Welcher is the pioneer of livestreaming…

JC Palmes: Yes.

Birgit Pauli-Haack: … in WordPress, and he’s done it for, I think, almost three years, if not longer. And he livestreams every Thursday at 2:30 PM, UTC, on Thursdays, unless he’s on a meetup or at a WordCamp or on holiday. And he has been, recently, working on adding user profiles and user interactions to his Block Developer Cookbook, which is the base of all his workshops where he has a few recipes that he walks through.

In live events or in-person events like WordCamps, people can vote on which recipe should be talked about. And so, it was quite interesting to see at the workshop at WordCamp Asia last year and this year, because every event is different, yeah.

JC Palmes: Yeah.

Birgit Pauli-Haack: So…

JC Palmes: I missed that one. I wanted to be there, but with being a local lead organizer for WordCamp Asia, you can’t really be on the sessions that you want to be just because there’s a lot going on on the, you know?

Birgit Pauli-Haack: Yeah. And unfortunately, workshops are not recorded, as far as I can tell.

JC Palmes: Yeah.

Birgit Pauli-Haack: … because they’re also too long, yeah, and they are not a… So, a talk, when it’s recorded, it’s, most of the time, fast-moving because you only have 30 minutes or something like that, but when you have a workshop that is 75 minutes, it is a lot of downtime in the end. It’s moving at a glacial pace when you sit at home at YouTube. So, I totally get it.

But you can check it out. We’ll share the Block Developer Cookbook repo in the site, in the show notes. So, you can definitely check it out. And maybe you want to get on the live stream with Ryan or JuanMa or Jonathan.

JC Palmes: Yeah, we’ll see what we can do about that.

Birgit Pauli-Haack: So, JC, what are the places that you watch for learning new stuff?

JC Palmes: Yeah, so I usually keep an eye on a few key places. The Make WordPress Core blog is, of course, a go-to because it’s where most of the important updates and demos get posted first, officially.

And I also follow what’s happening on the Gutenberg and WordPress GitHub repos, because the discussions there give a good sense of what’s being built and why certain decisions are made. There’s a lot there.

And of course, I check Learn WordPress pretty regularly, too, especially the developer workshops. I also stay actively lurking in Slack, mostly in Core Editor and Design. I try to catch Ryan’s live stream, always, when I have time, when I can, but I usually end up just going through the recorded ones on YouTube.

Birgit Pauli-Haack: Yeah?

JC Palmes: But yeah, they’re really great for seeing how things work in practice. And I read a lot of blogs, too. I can’t give you the list of the blogs that I read just because I don’t have a particular list. I just try to search for something that’s interesting based on the conversations in GitHub, and then, read through all the things.

Birgit Pauli-Haack: Yeah, excellent. Well, thank you so much for walking us through that. Yeah, I found the good with Gutenberg GitHub repo, really, there is so much there that it’s really hard to zone in on or zero in on the things that you, right now, need or wanted to explore.

So, tracking issues are really good, and there is now a label that says Tracking Issues so you can see the history of a feature, how it worked out, or what’s in the pipeline. Of course, with the contributions being reduced, it’s going to be a little shorter…

JC Palmes: Yeah.

Birgit Pauli-Haack: … or less features coming in, but sometimes it’s a good thing that there is a slower pace so everybody can catch up where they are. And I feel the same, yeah. I get the opportunity to dive a little deeper in all the things, although I was already, I have been quite deep into it, yeah. But if you don’t practice the skills to… it’s just superficial, yeah.

JC Palmes: Yeah.

What’s Released – WordPress 6.8 RC 2

Birgit Pauli-Haack: But talking about the Make Core blog, WordPress 6.8 is in Release Candidate 2, and it’s only about 11 days away from final release. So, if you haven’t tested 6.8, now it’s really time, and you need to carve out a few hours to make sure that your themes and plugins actually work at the sites, work with it.

And that, of course, helps when you have a standardized system so you only have to check, mostly, one site, and then, some exceptions. But yeah, go and test it a bit. The Field Guide has the whole list of it, but it’s also a little bit overwhelming.

But we can go through some of the dev notes that are in there, and we also have a link to The Source of Truth for the details on the block editor. So, the list of dev notes, I only had three or four stars in there. Now, you have all the stars in there. That’s cool.

So, to explain that to our listeners, I had the list of dev notes, and I put an emoji star to it and said, “Okay, JC, let me know which one you want to talk about, and then we’ll kind of have…” And she checked all of them. It’s really cool.

JC Palmes: I did add in the smiley face to the ones that I think are really nice.

Birgit Pauli-Haack: Yeah. So, I think that one of the major features coming on 6.8, I don’t know you how you feel about it, but for me it’s the speculative loading in 6.8, and it has such a great history because it comes out of a feature plugin that already had 50,000 installs in the last couple of years. So, what is it?

So, speculative loading leads to near-instant page load times by loading the URLs that users might navigate to them already in the background. And the feature relies on an API that is now supported by many browsers.

It’s called the Speculation Rules API, and it’s a platform feature so you can define the rules for which kinds of URL to pre-fetch or pre-render, and how early such speculative loading should occur. So, that’s in a nutshell, and has a lot of technical implications.

JC Palmes: I’m looking forward to this. This is one of the features that I really like, because I’ve been testing. So, for those who are using block themes, if you’re not, you should, speculative loading is already, it’s helping your site feel faster. You don’t have to enable anything, it’s just built in.

So, just to add into what you mentioned about speculative loading, what it does is preload pages users are likely to visit next based on how they interact with the site. So, when they actually click the page, the next page is ready and it loads almost instantly. 

Birgit Pauli-Haack: Yeah, it speeds up, yeah.

JC Palmes: Yeah. What I really like about it is that it improves performance without adding too much complexity. There’s no JavaScript to manage, no extra setup. It just quietly does its job in the background. And it’s one of those features that makes the experience better for users while keeping it very simple for developers, which I really like. Always a win in my book.

Birgit Pauli-Haack: Yes, yes, absolutely.

JC Palmes: Make it easy for me, yes, please.

Birgit Pauli-Haack: Yeah, yeah, it’s a win for you, but it’s also a win for the clients because their visitors are benefiting from that without any additional investment.

JC Palmes: Exactly.

Birgit Pauli-Haack: So, that’s the beauty of a WordPress open source system, that a lot of people work on it, and a few things just come with an update without costing a whole lot of money.

JC Palmes: Yeah.

Birgit Pauli-Haack: But let’s go a little bit back to the block editor. The first thing is that the global styles are now actually available from the left side of the screen, yeah. So, you have everything that you need reachable from the black navigation bar, and you don’t have to switch from one side to the next. Yeah, you can all do it in there, which is really cool.

JC Palmes: That always trips me up. Having to go from left to right when having it on one side just makes total sense.

Birgit Pauli-Haack: Yes. Yeah. And what also started to, from in there, is that you can now also get the style book from there. And it’s a little bit more intuitive because when you click on the typography, you see, in the style book, all the blocks that have text in them.

And if you go to images or, what is it, no, color, then you know all the blocks that have color settings in them, which are quite a few now, but it’s easier to zero down on a problem or on a concern, kind of, “Let’s look at our images,” or, “Let’s look at our paragraphs,” or, “What are the styles for it,” and all that. So, it’s all there.

And the user can actually change some of the global styles to switch out for their sites. If they don’t like the green of the button, they can make it darker or make it blue or make it pink, and make it for the whole site. So, it’s an instant replacement there. So, I really like the global styles to be a little bit more accessible for my brain. Speaking of a style book, it’s now also available for classic themes…

JC Palmes: Yes.

Birgit Pauli-Haack: … which was a long time coming, or when the style book came to block themes, it was an early request from theme developers to get it also for the classic theme, and that finally comes with WordPress 6.8.

JC Palmes: Yeah, that’s one of the features that I added a smiley on, because that’s big. So, having classic themes or hybrid themes able to access the style book is going to help a lot for those who are still on the fence about going full block, although they should, but it gives them that experience.

Birgit Pauli-Haack: Right, yeah. And also, the controls, yeah.

JC Palmes: Yes.

Birgit Pauli-Haack: So, it’s an easing into the modern WordPress world, although there’s nothing wrong with staying on classic themes, but it’s so much nicer to work with a block editor, yeah. So, one of the confusions that has surfaced with the block theme is the confusion that, am I editing, now, a template, or am I adding a content page or grading a content page?

And it took about, I think, a couple of years to figure out, and I am not there yet, we are not there yet, but to make that easier too, because the whole concept of templates was something that WordPress users, before, had no touch points. It was all in code and it was all for the developer.

And unless the theme developer had a customizer, there was no need to think about templates, all that. But now, that concept has arrived at the user, and to get this right in the brain, it’s sometimes really hard. And now, they have added a switch to show the template in the editor or not.

So, what that gives you is, when you grade a post and you click on the Show Template, you see where the featured image is and all the post content areas, and know, okay, when you click on the preview, it will show you, also, the whole page. Not only when you go to preview, but already in the editor, you see the whole page with header and footer and featured image and all that shows up. It takes the surprise out of it.

JC Palmes: Yes.

Birgit Pauli-Haack: And the same with pages.

JC Palmes: If you say there’s a switch that just gets toggled on when you see everything outlined for you, because that just makes things less confusing. So, this is a good move.

Birgit Pauli-Haack: Yeah. And the switch is in the preview tab, in the top toolbar, when you click on the preview, then you see that tab has changed, it has additional features now. So, plugin developers, your email newsletter person plugin can see the email from your post if you needed to, and there is also the show template off and on. It’s just a check mark. And it’s really nice, yeah. And it goes together with a Zoom Out view. The Zoom Out view is nothing new with 6.8.

JC Palmes: Yeah.

Birgit Pauli-Haack: It has been introduced to WordPress through 6.7, very rudimentary, but when you add a pattern to your page, it goes automatically to Zoom Out. So, you see more of it and you see the whole composition of it. Now, in the toolbar of that particular section or pattern that you just added, you can change the styles, if there are any, from the theme, and you can change the design.

So, if you have a call-to-action pattern, clicking on Change Design gives you the other patterns that are call-to-actions, or in the same category, and if you click that little drop that’s in the toolbar…

JC Palmes: Yeah.

Birgit Pauli-Haack: … yeah, you can browse through the styles for that particular call-to-action. And then, the Twenty-Twenty-Five theme, that’s actually quite nicely done. So, the developers of Twenty-Twenty-Five made a real good design system so you can just go through the color patterns for a particular section. It’s really nice.

And the option gives you only a few block options. So, in the tool block toolbar you see those two features, and in the dropdown of the three dots, you only get four options, that’s copy, cut, duplicate, and delete. There’s nothing else to do there.

JC Palmes: Yeah.

Birgit Pauli-Haack: Yeah. I found, yeah, it’s still a discussion if it’s a bug or not. For me, it’s a bug, but other people find it, well, maybe it should be like that is, when you switch off the show template-

JC Palmes: Mm-hmm?

Birgit Pauli-Haack: … it also switches off the possibility of zoom view, because the zoom view is on a certain element in the template, the main element, and if that’s not there, the zoom view does not show. So, if you are waiting for the zo…m view to come in because you added a pattern, you need to just check Show Template…

JC Palmes: Check Show Template.

Birgit Pauli-Haack: … yeah, switch on Show Template, and then you get it back. Or you could use… Oh no, that’s the wrong one. I thought that was a shortcut, but the shortcut is not for the template, it’s for the Zoom Out view, and it’s shift + control + 0 to get the Zoom Out view, but only when Show Template is checked.

JC Palmes: Yes. That sounds like a bug.

Birgit Pauli-Haack: Yes. And I’m sharing that bug with you all so you can chime in. It’s an interesting discussion. Because it’s two different things. In my brain it’s two different things, and they shouldn’t be covered.

JC Palmes: Yeah, completely two different things.

Birgit Pauli-Haack: Yes.

JC Palmes: They’re not the same.

Birgit Pauli-Haack: Thank you. Well, the design tools, well, then 6.6 they started, and then, 6.7, they continued with it, and 6.8, I think, is pretty far that every block has all the design tools it needs. So, color options, border options, dimensions are now available for almost every block.

And there’s a dev note called the Roster of Design Tools per block, and you get a table with all the blocks in the list and which kind of feature they have and not have so you can…

JC Palmes: Oh, that’s nice.

Birgit Pauli-Haack: … a fast check, yeah. But it could use a few more features, like, the header comes down, but with the theme right now, it’s not possible.

JC Palmes: We have a pretty sweet table style in DEL, BT.

Birgit Pauli-Haack: Oh, okay. Well, I’ll see if I can replicate the full table and put it somewhere where I have access to plugins, because on the Make blog, yeah, there’s not a whole lot of…

JC Palmes: Yeah.

Birgit Pauli-Haack: … the plugins all need to be tested and approved, and all that. So, did you get a chance to look at the Details block, changes there? Detail blocks was introduced, I think, in 6.7, I think, yeah.

JC Palmes: Yeah, I’ve been using the Details block mostly as an accordion FAQs…

Birgit Pauli-Haack: Yeah.

JC Palmes: … but this time around, I have not played around with the Details block when I was testing in 6.8.

Birgit Pauli-Haack: So, there are three different features that… So, one is that, if you have a list of the same things that you want to be controlled together, then you can give each one of the items, each Details block, so you have a set of three Details blocks and they’re all FAQs, for instance, so you can give them, in the the Advanced section, there is a Name Attributes field, and if you give them the name attribute, each one of them the same, then via CSS, you can control those at the same time.

And what also happens is that, when one opens, the other one closes, and vice versa. So, it feels more like a unit for that. And you see it that the FAQ thing, oh, I used FAQ here in the example, in the Source of Truth, and you see that it’s then attached in the CSS in the name field. So, they’re identically named, and then they’ve…

JC Palmes: That is a good one. So, we’ve usually added in a script to handle opening and closing the Details block as an accordion. So, having this baked in is big.

Birgit Pauli-Haack: Yes. And you can actually do it with a… a content creator can do this. So, the same developer can… yeah. So, this is really nice. 

JC Palmes: This is nice.

Birgit Pauli-Haack: Yeah. Then, what’s also nice is that the summary content, like the question for an FAQ, for instance, is then also shown in the list view of the block editor so you can identify which one you’re working with. That’s so nice because that helps quite a bit.

JC Palmes: Yep.

Birgit Pauli-Haack: And then, you can also create anchor links for each block so you can separately link to them from other places, and developers have a chance to modify the Allow blocks attribute to make sure that only the right blocks are used in a Details block.

So, there are quite a few things in there that makes it… I think that’s one of the biggest changes for WordCamp 6.8. When I was testing, I said, “Oh, this is neat. Oh, this is neat,” kind of thing.

JC Palmes: Yeah.

Birgit Pauli-Haack: So, I like that, yeah.

JC Palmes: I like that one.

Birgit Pauli-Haack: And then, the other things, some of the changes on the blocks are minimal, but still, quality of life changes. So, the Gallery block now has one link, or one way to put the link to open bigger…

JC Palmes: Yes, because having to…

Birgit Pauli-Haack: … and not for every…

JC Palmes: … do it on every single image when you’ve had more than 10 images there is not nice.

Birgit Pauli-Haack: I would have said two, I would have said two images. If you have more than two, you don’t want to do this for every image, but yeah.

JC Palmes: I’m a bit patient with galleries just because, but know 10 is my max, so…

Birgit Pauli-Haack: Yeah. No, but that is really good that you, just going through the tool while make sure they have the gallery parent, select it, go in the toolbar, and then you can select the Enable click to expand. The image block now has a feature, has a way from the blocks settings that you can, when you load it into your post, that you can say, “Okay, make this image my featured image,” and you don’t have to delete it and then load it again.

You still need to delete it if you don’t want it doubling up on your post. When you display featured images with a single post template, then you have that image in twice. But yeah, kicking out or deleting a block is easy.

JC Palmes: Yeah. But that update is a subtle but powerful workflow update because there’s no need to switch context, just to set a featured image. That saves time if you have to do it more than twice.

Birgit Pauli-Haack: Yeah. If you do two posts a day for every day, you’re really happy about that type of saver, yeah. And you don’t have to think for it so much, yeah. Because a lot of people have a website that does really nice things with featured image, but it falls down when they forget the featured image there.

That is something that they might… It prevents that people post something without the featured image. And then, the image block also has some handling. You can crop things and you can, well, mostly crop, or what else can you do with an image block, I forgot.

JC Palmes: Mostly crop.

Birgit Pauli-Haack: Yeah.

JC Palmes: Resize.

Birgit Pauli-Haack: And now, you actually know that things happen because there are little notifications on the bottom of the screen that, “Oh, yes, we had to crop this,” yeah.

JC Palmes: Yes. That always trips me up because when you crop an image, I always have to double-check, “Was it really cropped?”

Birgit Pauli-Haack: “Did it work,” yeah. And I hate that question, “Did this work,” or, “What happened,” yeah.

JC Palmes: Yeah. You just know it works when you look at the URL.

Birgit Pauli-Haack: Yeah. 

JC Palmes: It actually looks different.

Birgit Pauli-Haack: Yeah, it does, yeah. So, the Query Loop block, have you seen what’s coming in with that?

JC Palmes: So, this Query Loop block change is actually something that we, I guess, this is something that we wanted to fix way back. So, that is, that hasn’t been part of WDS-BT. It’s fixing WDS-BT, but with 6.8 having the same fix, I will have to remove that fix so that we’ll have the default one.

Birgit Pauli-Haack: Yeah. Which feature are you…

JC Palmes: It’s a long time coming. The sticky post for a Query Loop block where it’s adding in not being counted when you set a…

Birgit Pauli-Haack: Yeah.

JC Palmes: Yeah.

Birgit Pauli-Haack: Yeah, there are two things. One was already in there. It excludes the sticky posts. But now, there’s a new…

JC Palmes: They ignore one.

Birgit Pauli-Haack: They ignore one, yeah, where you can… And that means that the sticky part of that post is ignored, and it will behave like the other filters.

JC Palmes: Yeah.

Birgit Pauli-Haack: Like, if you do it by date or you do it by category or by tag, or something like that, it’s not sticking up on top on any of those sites. So, it’s a little hard. So, “excluding” means, none of the sticky posts are showing, and “ignore the sticky post” doesn’t mean ignore the sticky post, it ignores the sticky part.

JC Palmes: It’s having them go back to just a usual post not being counted as sticky, because sticky is sticky, it sticks to the front.

Birgit Pauli-Haack: Yeah, or the top, or whatever.

JC Palmes: Yeah, at the top.

Birgit Pauli-Haack: Yeah. So, there’s also a sorting option by page. So, for pages, you now can order by page order, in ascending order or in descending order. So, if you have pages and have parents, and then you have that, or have it in a certain order, the Query Loop can be sorted by that.

So, when you want to show them in a… Why would you do that? Oh, if you’re in navigation, or something like that, or it’s some pages and you want it all in the same, in a real good order there. So, that’s certainly something that’s new.

JC Palmes: Yeah, that is new. Usually, when we need to do that same order by, we usually do it custom just so we’re able to do it that way. So, this is huge.

Birgit Pauli-Haack: Yeah. I really like it because I had, often, use cases where they had a parent page about a certain topic, and then, sub-pages that go deeper into it, and they all needed to be on one page, and had featured images so you can really do nice grids, but if they’re in a different order, it… So, you really want them in the right order.

Yeah, get everybody confused. And then, there is another feature in there that comes out of the Zoom Out view, but it’s the button in the toolbar for the Query Loop, for the group block that holds everything together so you can change the design.

So, if you grab a pattern for the Query Loop, and after thinking about it for two minutes you don’t like it, you don’t have to throw it out again. You just click on Change Design, and then, you get a another list of the other possibilities how you can put it together.

JC Palmes: Yeah, I like the Change Design link.

Birgit Pauli-Haack: Yeah, very cool.

JC Palmes: It’s a game changer. You don’t have to… Again, it’s a quality of life…

Birgit Pauli-Haack: Absolutely, yeah. And you can now get the Query Loop for pages for all levels. Yeah, so you can say, “Okay, on the main page, I only want the sub-pages to show, but not the main page,” kind of thing. Yeah. And so, it’s really interesting.

And The Source of Truth as well as the PR, they had an example query, so you can test it out, a pattern there. So, you can go through that. Yeah, that was the Query block, right? So, next thing is the new block, the Query Total block.

JC Palmes: Yes.

Birgit Pauli-Haack: And it just shows the number of posts or pages in that particular query, and you can also add it to the pagination, or something like that, 10 of 12 kinds of things you get there as well. And it’s quite nice.

JC Palmes: One functionality that I need to recheck to see how that…

Birgit Pauli-Haack: Recheck on your theme, yes.

JC Palmes: Yeah.

Birgit Pauli-Haack: Yeah, I can imagine, yeah.

JC Palmes: That is built in as well. There’s a lot of updates in 6.8 that we fixed in BT that we have now to retest…

Birgit Pauli-Haack: Remove.

JC Palmes: … and remove as needed, which is quite nice, because it’s all going to be default functionality now. You don’t have to fight against the system.

Birgit Pauli-Haack: Yeah. And you have somebody else maintaining that part of the code?

JC Palmes: Right now it’s me and whoever is available at the moment.

Birgit Pauli-Haack: Yeah.

But it’s the whole set of contributors that-

JC Palmes: Oh, yeah, of course.

Birgit Pauli-Haack: … maintain that.

JC Palmes: Exactly.

Birgit Pauli-Haack: Yeah. And you don’t have to think about, “Oh, we had a customization there, so let’s figure that out.”

JC Palmes: Yeah.

Birgit Pauli-Haack: Yeah.

JC Palmes: Okay.

Birgit Pauli-Haack: So, while that was all going on in the release cycle and I was talking about things, I got a question that people who had a hard time finding or making sure that the Query Total block shows up, they couldn’t find it, it only shows up when you’re inside the Query Loop. It’s similar to the pagination. So, if you’re outside the Query Loop in your canvas, it doesn’t show up in the inserter because it has nowhere to go.

JC Palmes: Yeah, it has nowhere to connect to.

Birgit Pauli-Haack: Right, yeah. Well, you and I know that, but it’s not an easy concept for people.

JC Palmes: Oh, yeah.

Birgit Pauli-Haack: Yeah.

JC Palmes: I have to always think about that because…

Birgit Pauli-Haack: Yeah.

JC Palmes: … sometimes I just think in the developer mindset. So, it’s a switch.

Birgit Pauli-Haack: Yeah. Yeah, and sometimes it’s just surprising what is clear to me or others in the field. A new user or another content creator says, “How does that go? How does that work? I can’t find it.”

JC Palmes: Yeah.

Birgit Pauli-Haack: Yeah. So, the Social icon has minimal changes, but one is that it now also has the Discord icon. So, if you want to link to your Discord profile or Discord server, you can do this in the Social icons block, and it now also has, you can use the arrow keys to navigate to the link. You don’t have to go twice on adding the URL to whatever new Social icon you added.

JC Palmes: Yes.

Birgit Pauli-Haack: So, it’s really streamlining the process. Oh, I’ve just skipped over it. The Separator block can be, now, really expanded because you can add a different tag for it. The Separator block has only an HR tag until now…

JC Palmes: The HR, yeah.

Birgit Pauli-Haack: … the horizontal line. And now, you can actually replace it in the advanced HTML element section of the block and make it a diff. So, then, all the CSS that you can do with any other diff, you can now apply to the Separator block, and makes it a nice, it can be a nice decorative tool for your theme and for your site.

So, I think that transformation really helps with all that setting. Additional setting helps, really, with styling, adding more styling possibilities. I was just saying transformation…

JC Palmes: I guess we’ll be using the Separator block more?

Birgit Pauli-Haack: Yeah, it can be interesting breaking up the wall of text when you have some decorative stuff there. I can see that, for instance, the little pattern things that you had in WordPress Asia website, that they could be a little bit more [inaudible 00:41:53] instead of just an image, or something like that, yeah.

JC Palmes: Yeah.

Birgit Pauli-Haack: I was talking about transformation there, but I was just reading Transformation. What you now can also do is transform a Separator block into a Spacer block. So, yeah, there’s also one of the workflow improvements that come with 6.8. I don’t know if we have to go through the editor changes, all of them?

I think there are two new commands. One is, Add a New Page, and the other one is, I totally forgot. My God. Open the Site Editor. When you are somewhere in pages or something like that and you want to just go back, you don’t have to click 15 times to get back to the design tools.

No, you just do Open Site Editor, CTRL + K, and then, start with Site Editor, and it gives you the option already in the command palette that flows on top of your screen.

JC Palmes: Oh, keyboard shortcuts too.

Birgit Pauli-Haack: Yeah.

JC Palmes: There are two new ones, right?

Birgit Pauli-Haack: Yeah, it’s the…

JC Palmes: Pace, block styles with Command Control, and option…

Birgit Pauli-Haack: Oh, good.

JC Palmes: We didn’t… Yeah, that one. That set’s going to get heavy use.

Birgit Pauli-Haack: Yes.

JC Palmes: From me at least.

Birgit Pauli-Haack: Yeah.

JC Palmes: And then, that shortcut, you can now paste block styles.

Birgit Pauli-Haack: Right, yes.

JC Palmes: Yeah.

Birgit Pauli-Haack: You can copy-paste block styles over. That’s fast. You can really do that. So, the next thing, what I really like is, the Starter Content is now available for… You can switch that off. That’s the first thing. So, if you add a new page, it automatically comes with Starter Content, if the theme provides them, in a modal.

That gets in the way to get started with what you want to do. Some people like it and some people don’t like it. It’s the 50-50 thing. But some people… So, you can switch it off. So, you can toggle that Show Starter Content Patterns off, and you can also change it in the Preferences.

But you can also find them in the categories of your patterns. It says Starter Content. So, if you do want to see them, you can just go there and get a list of the starter content for that particular post type. 

JC Palmes: Yeah, that one I have not tested yet, but that will be useful for clients who have very particular styles for a custom post type. With the toggling on and off of that feature, is that available per custom post type or is that a global setting?

Birgit Pauli-Haack: It’s a global setting. Show Starter Content Patterns, that’s a global setting, but Starter Content, until 6.8, wasn’t available for other custom post types.

JC Palmes: Yeah.

Birgit Pauli-Haack: Yeah, but now it is. So, you can, if you’re just in the header of the pattern, you say that’s also for your custom post types, when you do add new custom post type, it also shows the starter content, which wasn’t available before.

JC Palmes: Yeah.

Birgit Pauli-Haack: So, that’s really cool.

JC Palmes: Yeah, that’s cool.

Birgit Pauli-Haack: Yeah, that’s definitely a good feature request for an enhancement to at least provide a filter for theme developers to switch it off for certain post types, and on for other posts. And speaking of theme developers, now you could have your patterns in different folders so it’s not all in the patterns folder, like, Twenty-Twenty-Five has, I don’t know, 80 patterns in one folder?

JC Palmes: A lot.

Birgit Pauli-Haack: Now, you can… And I had to do, with the name of the file, I had to sort it, like, H or CTA, dot, dot, dot. Now, you can have folders like Patterns, CTAs, and I’ll put them all in there, or Patterns and Testimonials, or something like that, yeah.

So, it’s a little bit more organized in your theme folder, and I really like that, yeah, because I’m also a fan to having separate style folders. So, I have styles for blocks and a style for other things.

JC Palmes: Yeah, that’s what we do with BT as well. So, styles are there included in folders if it’s words. I forgot what I was going to say. Yeah, just making sure that you have styles in the block folder.

Birgit Pauli-Haack: Yeah.

JC Palmes: And being able to do that for patterns is…

Birgit Pauli-Haack: Pretty organized, yeah.

JC Palmes: … yeah, that’s going to make things a lot more organized, because we don’t need more than 80 patterns in one single folder.

Birgit Pauli-Haack: Yeah. Maybe you don’t need any patterns, period, but some people actually, then, need them for a larger site…

JC Palmes: Yeah.

Birgit Pauli-Haack: … and then, you can sort it out through the folders, yeah. Because you have the categories, and if you make the categories also be your folders…

JC Palmes: Your folders.

Birgit Pauli-Haack: … yeah, it helps. So, that was what I wanted to… Well, we talked a lot about the block editor kind of thing, but I really like that because it’s such a neat tool, and we need to dive in, sometimes, really deeper into the features.

Now, for the developers, the Field Guide is out, and I definitely urge you to look at that and skim it at least for things that are interesting to you. There have been a ton of accessibility improvements, and Joe Dawson, the team rep of the Accessibility team has done a fine job putting that together so you can really see what has changed and what has been improved upon.

There are also some developer-related changes for the block editor in the miscellaneous block editor dev note. I think George Mamadashvili did that. He was also the editor tech lead for the release, or is, yeah. It’s not out yet.

And it definitely also deals with deprecations of being experimental, coming stable, or deprecated kind of thing. So, you definitely want to check that out to make sure that you have that on your radar when things get deprecated.

JC Palmes: Yeah, I always make sure that I check that because you can’t have deprecated machines, especially in client sites.

Birgit Pauli-Haack: Yeah. And when they’re announced through the console… So, sometimes clients tell me, “Okay, I get this yellow… What does it mean?” I said, “You have to ignore it.”

JC Palmes: It’s for styling. Just ignore it. 

Birgit Pauli-Haack: And then, there is a post about the interactivity API best practices by Felix Arntz, and also, Avoiding Deprecation Warnings is part of the headlines there. But definitely, if you are working with the interactivity API, definitely check it out. It gives you quite a few interesting pointers there.

Oh, there is a more efficient block-type registration. This is also from Felix, yes. Now, you can register multiple blocks in one function so it doesn’t have to be called over and over again, which is definitely a performance improvement, and also, you don’t have so much code in it then. Check that out.

JC Palmes: Yeah, I’ll check that out, because I’ve added in another custom function that allows us to do that just in one function.

Birgit Pauli-Haack: Yeah.

JC Palmes: You don’t have to call it out multiple times.

Birgit Pauli-Haack: Yeah, right, yeah. So, anything in the WordPress 6.8 that you wanted to talk about that we skipped here?

JC Palmes: Definitely, the new filter, because that’s going to be…

Birgit Pauli-Haack: Oh, the Should Load Block Asset on Demand.

JC Palmes: On Demand, yes…

Birgit Pauli-Haack: Yeah, explain that to me.

JC Palmes: Yeah. So, with that new filter, it really just allows developers to make sure that blocks will only load their assets, the styling, and the scripts for that block when it’s actually on a page.

Birgit Pauli-Haack: Oh.

JC Palmes: When it’s used on a page. So, that was available for core blocks before. Let me just… There’s one other filter, I think, that is part of that.

Birgit Pauli-Haack: Should Load Separate Core Blocks

JC Palmes: Should Load Separate Core Block Assets, that one we are using on BT, just handled differently. Again, custom function because we do have custom blocks that I would want to not load, because by default, that loads, right? So, with BT, that only loads when it’s actually used.

I would have to change to this new filter because this one is more efficient. It just does it out of the box. So, with Should Load Separate Core Block Assets, it does two things, it loads the core blocks, and then, with the Total Block library script, with all of the styling and stuff, and then, the scripts and the style sheet for that particular block, what this new filter does is, it loads, yeah, I mentioned that, it only loads the script and the styles for that block, not the entire thing.

Birgit Pauli-Haack: So, like…

JC Palmes: So, that’s going to be a lot of improvement. We do that already, which means I have to change that function to this new filter, which is amazing.

Birgit Pauli-Haack: Yeah. You were definitely ahead of your time.

JC Palmes: Because we need to fix things when WordPress is not yet ready to fix it because we need that function right away.

Birgit Pauli-Haack: Right.

JC Palmes: We can’t just wait. But glad that what we’ve done for BT is being done by default now.

Birgit Pauli-Haack: Yeah, you can rip it out. All right, my dears, dear listeners, we are all through the 6.8 release so far, and I hope you find some really good things in there. Now, we’re coming to Gutenberg 20.5.                                                       

Gutenberg 20.5

And don’t be alarmed, and we have 20.6, but there are not a whole lot of new things or mentionable enhancements that we want to mention here. So, we’ll still, probably, stay within the time of our podcast, although there is no time. It takes as long as it takes, like many other things in life.

JC Palmes: Because there’s a lot.

Enhancements

Birgit Pauli-Haack: Yeah. So, 20.5 Gutenberg Plugin, it has the updated edit site link for the admin bar that now goes, actually, back to the site editor and not to the page that you were actually on or the template that you were on.

So, that confused a lot of people because every time you clicked on it, you were on a different page. So, sure, every time you click on it, to go to the same page. So, that is really good.

The Create Block Package now supports blocks manifests and the relevant core APIs by default. That needed a little bit of bug fix in there, but that is now… It also has to do with the multiple blocks, right?

JC Palmes: Mm-hmm.

Birgit Pauli-Haack: Yeah.

JC Palmes: So, this one, I think, is a huge deal because having it aligned better with core and the support manifests by default means there’s less guesswork and just better starting point for custom blocks.

Birgit Pauli-Haack: Yes. Yeah, absolutely, yeah. So, the Block button, if it’s used in the navigation bar, now also has… So, when you’re in a navigation bar and you add another link, if it’s a custom page link, it offers you creating a new page, but not with a button. So, now, when you add a button to it, also gives you the capability to draft a new page, which is really nice. So, you can use those buttons more.

What else is in there? So, the Data View Actions, as a plugin developer, you can use a modal to do whatever the action is. And now, you also have the possibility that you can control the size of the modal so it’s not the same size every time.

And you have a lot of white space there, or you can focus on certain things. Now, you can actually control the size through props. That’s developer speak, but you will appreciate that.

JC Palmes: Of course. There are a couple of updates there that make me smile.

Birgit Pauli-Haack: Which one?

JC Palmes: The Trailing Period Cleanup and the Defaulting Back To, the 100 PX Spacer Block default.

Birgit Pauli-Haack: Oh. Yeah.

JC Palmes: These are really just petty things for me, but I’m glad that people find them weird as well. So, they’re fixing it and adding it back, thank you.

Birgit Pauli-Haack: Good, yeah. So, there’s a change in the Data Views, which comes on par with the WPA, the old page things where you have the pages listed in the admin as a sub-page if you have sub-pages like… So, hierarchical kind of dimension there.

JC Palmes: Yeah, hierarchical and not a flat thing. And that helps.

Birgit Pauli-Haack: And that now came, also, to the Data Views. So, you have a cluster, the way you actually designed it or put them together. So, I’m sorry, there’s a little…

JC Palmes: I’m also reading through.

Birgit Pauli-Haack: Yeah, I need to read through that.

JC Palmes: Oh, the mobile one.

Birgit Pauli-Haack: Yeah.

JC Palmes: So, when I test VT, I always test on multiple interfaces, like you should, and that also includes editing.

Birgit Pauli-Haack: Oh, yeah, editing on mobile, yes.

JC Palmes: Editing on mobile is a lot easier.

Birgit Pauli-Haack: Oh, now, yeah. That’s good, yeah. What else do we have? That’s pretty much for 20.5.

JC Palmes: Yeah.

Documentation

Birgit Pauli-Haack: Yeah. There’s also the documentation about the WP scripts with the build blocks manifest has been updated as well. So, you can read up about it. And the Color Experimental Duotone has been removed from core blocks, but I hope they’ll keep it in. That is stabilized now. So, it’s called Filter Duotone instead of Color Experimental Duotone.

So, it’s just a rewording of things, and also, to make it stable so people are more inclined to use it in their custom blocks as well, because some people shy away from experimental stuff because they don’t know how it will turn out.

JC Palmes: Usually, they change their name, which is going to be the case here. I don’t think we have… So, for our client projects, we usually do shy away from the experimental stuff just so… It needs to be as stable as it should be-

Birgit Pauli-Haack: Well, that makes total sense.

JC Palmes: … in my personal projects still, yeah. I do use that in my… Well, I play around with all of the experimental stuff on my own theme.

Birgit Pauli-Haack: Yeah, it’s fun, right?

JC Palmes: You end up seeing all the things that get broken on the next update, which is fun.

Birgit Pauli-Haack: Or you at least can start prognosis, like, “Which one gets broken first,” kind of thing.

JC Palmes: Yeah.

Birgit Pauli-Haack: Makes begging easier. So, that was Gutenberg 20.5. 

Gutenberg 20.6

We are now coming to Gutenberg 20.6, and there are additional features in there that are not coming to 6.8, except for the Enabling the Startup Pattern for all post types. That was back-ported to 6.8, but the others are…

I don’t think that the keyboard shortcut to paste styles is actually in 6.8. I think that’s in the Gutenberg plugin, and it doesn’t have the, yeah, it does not come to 6.8.

JC Palmes: That’s sad.

Birgit Pauli-Haack: That’s sad. Oh, so sad.

JC Palmes: I liked that.

Enhancements

Birgit Pauli-Haack: Yeah. So, they’re adding support for more granular controls for the Table of Content block, which also hasn’t made it to Core yet because it needs a little bit more finessing.

JC Palmes: Yeah.

Birgit Pauli-Haack: But if you use it in your private sites, or while some people, like me, are brave or are stupid, depending on the perspective, they use Gutenberg.

JC Palmes: They use it on…

Birgit Pauli-Haack: Yeah, Gutenberg production.

JC Palmes: Yes. But this Table of Content block controls things that I love.

Birgit Pauli-Haack: Yeah.

JC Palmes: But again, it’s one of those almost-there blocks.

Birgit Pauli-Haack: Yeah, yeah. And what we are talking about right now is that you can select the heading levels. So, if you want all the H2s in there, then you can say that, oh, you want all H1 to H2 to H6 in there, you can say that too, or anything in between.

So, it’s a nice setting on the sidebar for the Table of Content. And I think I tweeted out a little video to show that off, but… When I was testing it, I said, “Oh, this is nice.” Yeah. Then, whereas the navigation bar has…

JC Palmes: Navigation, yeah.

Birgit Pauli-Haack: … it gets a transparency slider for the sub-menus background, which is highly appreciated. But also, that is not yet in. It just came in in 20.6.

JC Palmes: Just began in 6.8 too.

Birgit Pauli-Haack: So, that is out. So, 6.8, just so, if you want to go back and look at things, 6.8 has Gutenberg plugins from 19.4 to 20.4. So, with 2020. And most of the time, only bug fixes get back-ported to the current version, but then, new enhancements are not going to make it there.

In 20.6 Gutenberg Plugin, you also get a new option for opening the links in a new tab for the RSS block. And that is something that a lot of people wanted, and now, we have it. Now you can shortcut for pasting styles. Was that the 20.6 already?

JC Palmes: Yeah, that’s the 20.6…

Birgit Pauli-Haack: Yeah, it was a small release because most of the Gutenberg developers like George Mamadashvili, Fabian Kägy, Akiyama Anu, and a few others, they were all really, in the release cycle, occupied with that. So, yes. But that’s it. We are almost at the end of our show.

Well, thank you, dear listeners, and thank you, JC, for sticking it out with me and having a discussion on that. It was wonderful to chat with you about the things. And dear listener, as always, the show notes will be published on Gutenbergtimes.com/podcast.

This is Episode 116, and if you have questions and suggestions or news you want us to include the next time, just send them to changelog@gutenbergtimes.com, that’s changelog@gutenbergtimes.com. So, this is it.

Thank you, JC, thank you, all, listeners, for being with us again. And hello, all the new ones that we gathered, new listeners we gathered on all the different podcast apps. Well, I wish you a great weekend, everyone. Well, the weekend will be over when you get to read this. So, I wish you a nice weekend, JC.

JC Palmes: Thank you.

Birgit Pauli-Haack: And until the next time, thank you.

JC Palmes: Thank you.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.