Gutenberg Changelog #111 – Gutenberg 19.6 and 19.7, Developer Hours, Playground, and Collaborative Editing

Gutenberg Changelog 111 with Anne McCarthy and Birgit Pauli-Haack

In this episode, Birgit Pauli-Haack and Anne McCarthy discuss Gutenberg 19.6 and 19.7, Developer Hours, Playground, and Collaborative Editing

Show Notes / Transcript

Show Notes

Announcements

Community Contributions

WordPress 6.7 and 6.7.1

Gutenberg plugin releases

What’s discussed and in the works

Stay in Touch

Transcript

Birgit Pauli-Haack: Hello, and welcome to our 111th episode of the Gutenberg Changelog podcast. In today’s episode we’ll talk about Gutenberg 19.6, 19.7, developer hours, playground and collaborative editing. I’m your host, Birgit Pauli-Haack, curator at the Gutenberg Times and full-time core contributor for the WordPress Open Source project sponsored by Automattic. With me today is the brilliant Anne McCarthy, product manager for WordPress and author of the Source of Truth posts that she’s keeping for almost over a year. No, two years maybe. Forgot. Yeah.

Anne McCarthy: Might be almost.

Birgit Pauli-Haack: Hi, Anne.

Anne McCarthy: It’s been a long time. Yeah. Hello. Thank you so much for having me. And also I feel like it’s like a lucky, I don’t know, 1, 1, 1, 1. I’m like, I’m into that 111. That feels good.

Birgit Pauli-Haack: Yeah. Yeah. I can’t believe it’s over 100 episodes, yeah.

Anne McCarthy: That’s amazing.

Birgit Pauli-Haack: Yeah, it’s amazing. All the co-hosts that I had and special guests, it was really, it’s quite a trip. And I’m still excited and people are listening to it even more. And so, this is my shout-out for all the new listeners on the podcast. And if you want to, please, please leave a review, whatever you feel about the show, it definitely helps with the distributions. Anne, while 6.7 came out, you did a masterwork of Source of Truth. Can you pick up two features that you are most excited about from this release?

Anne McCarthy: Oh, yeah, that’s tough. Yeah, two features. I am very biased by the things that improve the experience and the feedback that we heard back when I was running the FSC outreach program. That’s something that I’m always thinking about. And so for me, I would pull out, zoom out. I think zooming out and being able to build with patterns, one of the big issues that we used to have back in the day was that it was hard to find the discoverability of patterns and to work with pattern’s a lot easier.

And I think the potential of zoom out, I think there’s a lot of things that we need to figure out still. But I think the potential of zoom out and the ability to zoom out and focus on the sections of your site, to get out the granular details is a huge win and something that can be built upon and used contextually right at the moment when you need it. I think that’s the part that we need to start sorting through is do we now expose this when it comes to adding a new page or adding a new template? Because I know some folks really don’t like that pop up of starter patterns.

But I’m always fascinated by how we can make the pattern experience easier and make the site building experience for folks who need it a bit more approachable and more section by section. I’m really, really excited about it. I just built a site for someone recently, a podcast I really like. And that’s one of the things I was most excited to show her is like, “Hey, if you want to add future stuff, look, you can just, boom, sections. Add this in, you can just add these patterns.” And I think it makes the user experience a lot better.

The other one I’ll mention is more technical, but something that also has been a long-standing point of feedback back. Back when I was doing developer relations, developer advocacy, the template registration API, I remember early on so many plugin authors being like, “How do we adopt block templates? How does this work? How do we register things?”

And I would send very niche GitHub links to how other folks had done it. And this registration API just eases all of that. And I’m really excited for folks to increase the adoption of using block themes and block templates and embracing a block world. And I am thrilled that that has landed in 6.7. And I hope more and more folks can take advantage of it. Those are the two very different, but I would say those are the two that make me excited.

Announcements

Birgit Pauli-Haack: Yeah. Excellent. Excellent. Yeah, we talked about 6.7 with other hosts here before because it’s an eight to nine weeks release cycle. In between we had our episodes and we looked at that. But we are looking to the future. We have right now on the Make Core blog, we have two posts. One is the release schedule proposal by Héctor Prieto for next year and I can’t believe we are going to have a 7.0 release in 2025.

6.8 is proposed to be scheduled for April 15th, 6.9 for August 5th and 7.0 for November 11. And it’s all around the flagship word camps, around some holidays and way before Black Friday the new version is out. Even those who experienced a lot of traffic for the last two months of the year, they can do it with a new version.

Also for WordPress 6.8, the call for volunteers is out, so if you want to contribute to a release, it is definitely a certain advanced level of contributing. But what you can do, even if you don’t have experience, you can shadow people that are on the release. To maybe do that and then start working in the release squad for 6.9. Definitely try and figure that out if you want to contribute.

Otherwise, there are multiple other ways to contribute to WordPress course. We all have done it. We all did some documentation changes, we did some reports on the Gutenberg and the track tickets we tested with that. And testing has become really fun now with Playground. Yeah, it’s really interesting to see how that sped up so much. Any thoughts about that?

Playground

Anne McCarthy: Yeah, I am super… It’s so interesting when I had a call this week with some of the WordPress YouTubers, an AMA with Matías Ventura, the project architects of Gutenberg. And Playground is something I’m so fascinated by because it really does make it immediately accessible. You immediately can have your hands on it and it works well.

And Playground, one of the things I love about the Playground team, and this is something I think that’s really important when you’re using a new tech like that, they want to hear what would make your experience better, easier, if you run into a bug, all that sort of stuff. You’re getting… We report stuff all the time. I feel like that’s one of the things that I really love about these efforts right now in the WordPress project is there’s so much momentum and so much care and thought being put into those tools.

And so if you haven’t given it a try, please give it a try. If you’ve run into an issue, please, there’s a GitHub repo where you can open issues. But I’m really hoping we can get more educators and influencers using it to help bring WordPress to more people. If you haven’t been paying attention to WordPress Playground, I definitely encourage you to do so. And it’s a great way to test things early. As Birgit was saying, testing is a lot easier and more approachable thanks to a lot of the stuff that’s being done there.

I always find it a great way to, whenever I’m doing the Source of Truth, I’m spinning up WordPress Playground constantly. I think there’s some stat where I think 700,000 people have used WordPress Playground. I’m probably 50,000 of those. Because I feel like I’m using it probably on a daily basis, so if that’s helpful insight for… I truly probably use it on a daily basis. If you aren’t, it’s definitely something to add to your list of tools.

Birgit Pauli-Haack: Definitely. Yeah. If you want to learn more about Playground, we are planning some Hallway Hangouts. Hallway Hangouts are informal discussions with contributors on their new features and what they’re working on to give a little bit feedback but also to show off a few things to trigger some creativity.

And there’s Ajit Bohra who is a early adopter of Gutenberg as well as a Gutenberg contributor, has built a blueprint builder. Blueprints are the configuration files for Playground. And he made this into a block editor feature and had been working on it. And so next week, February… February, how did this come in? No, it’s Friday, not February, it’s Friday, November 29th at 14:00 UTC we are in a Playground Hallway Hangout with Ajit Bohra. And he shows off what he has done, what his vision is, what the team is going to think about. Adam Zielinski who was the sole developer for a year now has the whole team behind Playground will also be there.

And the second event is with Tammie Lister and discussing how agencies can use Playground for their product, in their client work and all that. That’s December 6th, also 14:00. These are save the date for you right now. We are publishing that on the Make Blog on Playground before with all the Zoom links, but that’s just to get it out before that happens. And you know about it.

There’s also a developer hour coming up on December 17th that’s also on Playground and watch the announcement on meetup.com. It is not quite clear what the topic is about, but it’s definitely on the roster. December 17th for 16:00 UTC. And this week was a developer hangout. No, next week, I’m sorry. I’m getting my weeks mixed up. 

Anne McCarthy: So much is happening. I don’t blame you.

Birgit Pauli-Haack: Yeah. December 3rd there is a 16:00 at 16:00 UTC. Ryan Welcher will talk about improving your workflows with WordPress development tools. It’s about extensions, it’s about create block, it’s about create block theme, it’s about webpack and all the different things that can make your life easier. That’s also sniffers for coding standards and all that. You will learn how to use them and how to make it easier for you to develop things.

This week what I wanted to say was the recording of the developer hours is available on Exploring the Block Bindings API from WordPress 6.7 with Justin Tadlock and Nick Diego. They just had the block bindings actually my favorite thing for 6.7 that it’s in the UI and you can connect your custom fields with the blocks and have an automatic display on the front end that’s just phenomenal and is really magic for me. But that’s what you can see in that recording.

Community Contributions and Developer Hours                                                      

All right. Now the announcements. The developer blog has some new things there since we last talked about it. Of course, the What’s New for Developers comes out every 10th of the month. And that covers a lot of things from 6.7 but also from the 19.6 release that we are going to talk about today. And we have a new post format on the developer blog called Snippet, which is a small explanation of a problem solution for one task and then the code snippet with it.

There are two snippets there right now. One is how to disable heading levels in the editor. That’s about a feature that came with 6.7 as well is different heading levels and how you can control that. When you have your editors and they are not supposed to use H1s, you can disable that from the drop-down list. And you can also say, “Okay, we don’t do H5 and we don’t do H6,” and disable that. And the snippet shows you how to do that very easily with BHP.

The other one is to conditionally unregistered patterns. That’s important for theme developers who have patterns for plugins that might not be installed yet. You don’t want to show the pattern because it runs into a problem. Now you know how to conditionally unregister those patterns and both by Justin Tadlock. All right. That’s from the developer hours to developer news. And from the upcoming events, the Hallway Hangouts and developer hours.

Anne McCarthy: I love all the formats that are happening. There’s so many learning opportunities and I really liked the new snippet approach. I saw that coming up and I think that’s a really neat way for folks to get bite-size… The tutorials are so cool. I followed some of them to learn. And the snippets I think really round it out. Kudos all around. I think it’s just awesome how much… I’ve never… In my opinion years ago, I think this is the dream. If we had to be able to see how much stuff was going on, it’s just amazing how many resources there are and ways to either watch live or watch later and learn with other people. It’s really cool.

Birgit Pauli-Haack: Yeah. And we will also bring the developer hours recordings into the developer blog.

Anne McCarthy: Nice.

Birgit Pauli-Haack: That’s on my list for the last thing that I’m going to do this year is to create the custom post type and figure out how we lay it out and what additional information is going to be around the embedded videos. But yeah, it’s such a great tool. And we are all working towards the extenders who try to use the new APIs, be it interactivity API, the block bindings or even the block hooks that came out in 6.6 and 6.5. There’s always something… And especially also using block themes with the style variations. And so the developer blog is now a… It’s been around two years this month.

Anne McCarthy: Wow.

Birgit Pauli-Haack: And we have about 50 posts. And this definitely enriches it because not everybody has time to read 3,000-word tutorials when they’re looking for something. Yeah. Yeah. And if you have any ideas, dear listeners, about what should be written about, you can always come in into the core-dev-blog channel in WP Slack and the Make Slack and figure out how that is. There’s on the website there’s also how to contribute, how you go from idea to post if you want to write for it. Yeah, definitely. You can also subscribe to it so you never miss a post again with developer.wordpress.org/news/subscribe and put in your email address and you get notification.

What’s Released – WordPress 6.7 and 6.7.1                                                       

That brings us to what’s released. And we talked about WordPress 6.7. We have in the show notes for you the field guide 6.7 and also Anne McCarthy’s WordPress 6.7 Source of Truth published on the Gutenberg Times. But I mention it also because this week WordPress 6.7.1 was released and it fixed a few bugs that okay, those needed to be really done fast because there was a fatal error or the editor didn’t work right when you had uncategorized pattern browsing or there was a TypeScript error on the categories for theme patterns. 

Anne McCarthy: Was an auto-size issue with lazy loading and that was a big one that we saw. I saw a lot of reports of across many different areas. And so that will be fixed and yeah, I’m excited. I’m really kudos to everyone who worked on that. It’s a huge… It’s one thing you race to the finish line to get the big major release out and then to do another point release. It’s just really impressive and a lot of effort from a lot of folks in the community.

Birgit Pauli-Haack: Yeah. And that’s just nine days after the release of 6.7, so that’s really kudos to the release leads. There was Jonathan Desrosiers and Carlos Bravo who pushed this all over the finish line with the contributors that actually fixed the bugs. But now some of them is in the upcoming Gutenberg releases we’re going to talk about.

Gutenberg 19.6

Which brings us to Gutenberg 19.6. 194 PRs with 57 contributors, eight were first timers. Kudos to them getting their badges for core contributing there as well. It has 37 enhancement, 65 bug fixes was the one that was released right before release candidate to get all the bugs in. And the rest is always on documentation, tooling, code, quality and components. Let’s dive in. What’s first on the list? 

Oh, yeah, there are two things that I want to talk about for the developers. The great block scaffolding tool has a new flag. It’s called Dash dash target dir, to allow the tool to also target where the scaffold should be placed.

There were some conventions that you had to call the command line outside the plugins in the plugins repo to get a next folder into the repo to where your blocks are created. And now you are in more control of where you can place the new block or a new series of blocks with a scaffolding tool. That was a major request from developers that that might be added.

And the other one is with wp-scripts, you can now also do a root folder argument for the plugin zip command, so you get your plugins packaged. And that’s in the right folder or from the right folder. That’s better there. I want to point that out for the developers on the show using the tools that are built into Gutenberg. Do you want to take the Block Libraries B list?

Enhancements

Anne McCarthy: Yeah, let’s run through that. I love block library updates because it’s amazing how just slowly chipping away at stuff, whenever I’m doing a Source of Truth, I always find there’s a beautiful set of things that have just big and small tools like 6.7 had shadow support for the group block, which folks really wanted. And it’s just amazing how the improvements continue to come.

We have a transformation from separator to spacer blocks. And that just allows whenever you’re using the transform menu to easily switch between things. I think that’s a great one. I think it makes a lot of sense. I actually am really… Whenever I was looking for the changelog for this, I was excited to see it. I ran into that maybe three weeks ago and so it’s like, “Oh, yeah, this is an obvious one to have.

But adding the lightbox option in the gallery block link control. I actually used this. When did I write a blog post? Three days ago? Whenever you add a gallery block before you had to individually select each image block within it to add that lightbox and the lightbox is when the image takes over the screen. And now there’s just a control at the top level. When you’re selecting the gallery block, go into the block toolbar, hit the link, and you can easily just have it applied to all the images. Which yes.

Birgit Pauli-Haack: Such a relief.

Anne McCarthy: Yes, it’s a relief that it’s perfect… Yeah, it’s like, “Oh, this makes perfect sense. Why didn’t we have this before? I love when that sort of stuff comes out.

Birgit Pauli-Haack: Yeah. Not everyone has just three pictures in the gallery. Some people have 20 pictures in the gallery. And then it’s really…

Anne McCarthy: And it’s funny. Yeah, I was like, “When did we add this?” Because I literally… Yeah, that’s something I cannot tell you how many times I have gone through and manually added that. Or I’ll miss one image by accident and not realize it. This just makes it so much easier for the archives. There is now border block support, which is great for block theme authors. Border support is also added to comments. Just again, more styling options.

The cover block has image resolution options now, which is just again, more control to more having commonality between every image block. And this is something I think about a lot whenever you’re working with blocks that interact with media is like, how can we make it as similar as possible When you’re working with image things? Because that is an inconsistency that it wears on you when you’re using a block and it’s similar, you’re like, “I’m just using an image. Why is it different if I’m using the cover block or the image or the gallery block?” We should have a lot of congruence there.

Birgit Pauli-Haack: Totally.

Anne McCarthy: And so it’s neat to see that.

Birgit Pauli-Haack: Yeah, yeah. Love it.

Anne McCarthy: And then the HTML block forces the HTML preview when you’re in view mode, which I actually need to look at this and make sure I’m going to get this right.

Birgit Pauli-Haack: The view and design view, yeah, the edit view, that changes. I think there’s a writing, write mode coming that I have to dive into because the change was edit and view and now it’s write and design. And I need to figure out what the differences are.

Anne McCarthy: Oh yeah, if you ever offline, want to talk about that, I can do a deep dive about write mode. I’ve been up in there opening a lot of issues around that.

Birgit Pauli-Haack: Hallway hangout about it. 

Anne McCarthy: Yes, I think that’d be really smart mode for any folks who have blocks bundled in their plugins, something to pay attention to. And there’s a great tutorial that I think Nick Diego just did around adopting your blocks to content only that you can find the developer blog. I’m pretty sure that’s live. I saw a draft and now I’m like, I’m pretty sure I saw it live.

Birgit Pauli-Haack: It’s live. It’s live on the developer blog.

Anne McCarthy: Okay. Cool.

Birgit Pauli-Haack: Oh. And I’ll share the link then in the show notes. Yeah.

Anne McCarthy: Cool.

Birgit Pauli-Haack: The next one is that we have a… Oh, your favorite feature. The zoom out note now has a keyboard shortcut to open up the editor of being available in the editor. You can zoom out per keyboard and you don’t have to look for that little icon there. And there’s an iterated zoom out shuffle into a more visual control. What does that entail?

Anne McCarthy: It’s cool. I can talk about that a little bit.

Birgit Pauli-Haack: Yeah, please.

Anne McCarthy: Before whenever you were zoomed out and looking at the patterns, there was this shuffle option. And while it was nice to just quickly switch through it, it shuffles through patterns of the same category. The issue is you’re not seeing visually what’s coming next and you can’t get at a glance, “I want to switch to this.” And so it changes it from this shuffle option to this change design option. You’re also a bit clearer on what it’s doing.

And it gives you this nice little preview of, okay, change design, and then look at a list of the patterns related to this. And then you can visually select what you want to change it to rather than just a full blown shuffle, like what’s going to happen when I click this? It allows a bit more control and predictability to the experience. I was really excited to see this.

I have noticed I need to test this more as part of the fun of things when I was working on a site yesterday, that there’s a little bit of lag. Definitely keep… This is one of those areas that when we talk about zoom out is a great initial feature. I’m really excited to keep iterating to make it more useful. No, feedback is very much welcome there.

Birgit Pauli-Haack: The data views is the way how you in the site editor, you can navigate all through all the templates and all the pages and patterns. And it’s also the predecessor for the new admin design. But that has now in the templates, it hides the media field in the list view, which makes it a little bit more dense and more streamlined. Yeah. The next one is, I really love that, the style book now has a color tab where you can see all the color variations. This additional stuff, we’re going to talk about it in 19.7. But the style book is coming really to its better use now that we have all the different features like the style variations, block variations and that. Do you want to do the next one?

Anne McCarthy: Yeah. Real time collaboration, this is relating to inline commenting specifically. There was a lot of work being done around inline commenting that I think we’ll get into later. But basically comments were disabled for published posts for now. You can imagine this is basically to narrow the scope.

While we’re trying to get this feature in place to have it be ready for future release and maybe a bit beta form, there’s some just hard decisions that be made to narrow the scope so we’re not just completely exploding the scope and then something doesn’t work super well. The decision was made for post after they’ve been published to not have the ability to add comments.

And we actually got great feedback from some folks in the enterprise space who there’s a channel for real time collaboration. I posted it about online commenting. And some of the enterprise folks are hanging out there and it was great. One of them actually chimed in on the main iteration issue for what’s coming next with online commenting and mentioned, “Hey, that thing you just disabled, we actually want that.” I think that’s part of the beauty of keeping folks up to date and having that tight feedback loop.

The second that was disabled, someone was like, “Can you revert that? I actually want that.” And it’s like, “Yes, yes, yes. Eventually we will revert. This is just for now narrowing scope.” That’s what you can get from that release. But that’s part of the beauty. I wanted to mention the feedback there because I think it’s really cool that folks are paying such close attention.

Birgit Pauli-Haack: Yeah.

Anne McCarthy: Behind the scenes stuff.

Birgit Pauli-Haack: I think I was one of the people who said, “I want this back.”

Anne McCarthy: Yes. Yeah, yeah, you comment on it too. Yeah.

Birgit Pauli-Haack: Yeah. But the inline commenting when you get… It’s an experiment still in Gutenberg, so you need to enable it so you can see it. But then it’s really good to have the… Because you can comment on each block and you can have replies. And it’s a great way to collaborate on things and have one editor there and have everybody else comment on a picture or on a block or on a quote or on a design. If you use the design tools and to just have it right there.

And when you open up a post, you see the comments there, you can open it up, you can even pin it to your sidebar. It’s a great feature to test out and comment on. And when you have a few minutes in the afternoon or something like that, I really enjoyed it. And to see what’s coming next in the experiments, there are a lot of experiments in Gutenberg.

Anne McCarthy: Yeah. I know we need to groom that list. I’m trying to wait for the right time to do a make test post asking for feedback. If you want to wait for more curated specific, “I can look at this post and follow these instructions and click on this link and I’ll open a WordPress Playground,” you can wait for that too. Because that is something… I just am trying to wait for us to fix some of the obvious stuff before asking people for their time. That’s something I’m always mindful of is the right time to bring folks in where it’s the most impactful for bringing feedback.

Birgit Pauli-Haack: I have to tell you, I love your test instructions. Every time something comes out, it’s such a great way to explore a new feature guided. But then all of a sudden, now that you know how it works, you can create an opinion and I always have an opinion. I travel with it, but then you also can pinpoint it to a certain instruction as well. It’s a guided testing instruction. And also exploring new features. You do fantastic work with that and I’m looking forward to some of the new ones that come out.

Anne McCarthy: Thank you. Yeah, that’s helpful to hear. Because I want it to be that. I want it to be both exploration and feedback. We need to be veering people into what’s coming next so they can have that opinion that you just described. Yeah, that’s really cool to hear.

Birgit Pauli-Haack: Yeah. The next one was on a backport that actually made it into 6.7. It was an improvement to get the post format in the query loop. And that is something that if your theme supports post formats, there is a way to do archive pages and all that. It’s not 100% seamless. There is some thinking through it from the developer part when you build a theme, but having that is definitely helpful so you don’t have to write the query yourself. There is a… I am a little bit… I don’t remember. 

New APIs

Anne McCarthy: I know this preview, I was like, “I can talk about this a little bit.” But yeah, basically, there’s, yeah, a new API is preview mode flag. And this is something that it looks like it’s been three years looking at the PR since this flag was there to basically allow, to indicate if a block is rendered as part of a blocks list, a block preview, a pattern preview, et cetera. And it’s a way, at this point we need to make it stable. And this came in again from feedback. What I really like to call out whenever this is influenced by feedback.

And this came up with in Jetpack where Riad was helping someone on the Jetpack team when they were asking questions. And he was like, “We should probably stabilize this. It’s been three years now. This isn’t actually unstable, but if we can render a placeholder for this, let’s do it.” And so this is really helpful and it’s just another signal. We do want to be careful about what we list is stabilized. And so this is one of those examples where it’s good to have just another tool in the toolbox to stabilize it for plugin authors.

Birgit Pauli-Haack: Absolutely, because a lot of plugin authors are a little hesitant to use marked unstable or marked experimental flags features. And so adoption is really slow, although the things have been used in core or with other plugins quite a bit already and are stable, but they haven’t been made stable. And I know for the next release of 6.8, there’s a huge push on that for some of the design tools like the fonts and border controls and all that to make that what’s experimental to be stable and move that forward. It’s really cool.

Bug Fixes                                                       

I think we are through the enhancement on 19.6, but there are a few bug fixes I wanted to point out. The first one is the self-nesting and circular nesting block fix. Up until that fix, it was really possible to have a block that has inner blocks to make it an inner block of itself. It’s like an Inception, if you ever saw that movie. It really confused the block and what to do with it. And you could also nest blocks that are the same nesting in multiple times. It’s like the infinite mirror when you go in zoom and you share a screen and everybody can… You see yourself multiple times, but that is definitely fixed. Or well, if it’s not, please let us know.

And the other part that I wanted to shout out is that there is the link shortcut only to be triggered when there is a text selection. And that has to do with the two features that are triggered by the same shortcut. And depending on which context you are, it gives you the right tool. Control K opens up the command palette where you can then just look for a new open site editor or create a new page. You can do this in the command palette, but it also lets you add a link to the canvas if you’re in there.

And if you are having a text selected, you could trigger that, creating a link with control K, but you wouldn’t be able to trigger the command palette. And if nothing is selected, that’s what you probably wanted. There were a few people, there’s a whole discussion about it in that PR about maybe changing the shortcut, but it’s the internet and the software developers have used the same shortcut for multiple things.

It’s, yeah, exercise. People know about it, and here it comes together quite interestingly enough. But, well, I don’t know about you, but if I have a text selected, I don’t use Control K. And I just do copy-paste and have the link underneath my text selection. It doesn’t bother me, but it would’ve bothered me if Control K gives me the control panel, it doesn’t give me the command palette and rather opens the link feature there. I think it was a good decision. Riad made the pragmatic decision.

Anne McCarthy: I think it was a really good call because this is definitely, I have found it to be incredibly frustrating with the command pilot. And I think it has impacted the experience of using that and the likelihood of people using it in a way that it’s just not predictable. I think this will… I really hope it’s a meaningful improvement and it seems like it is based on… I actually helped test this at one point and just forgot to leave feedback. But yeah, I’m excited to see this in place and hope it helps.

Birgit Pauli-Haack: Yeah, it definitely does.

Anne McCarthy: It’s a great call out. Yeah.

Birgit Pauli-Haack: Yeah. I wanted to let everybody know that command palette, control K is a shortcut to get to you fast. And I think that’s it. Yeah, that’s pretty much what I wanted to talk about in Gutenberg 19.6. And we go right into 19.7.

Anne McCarthy: Let’s do it.

Gutenberg 19.7

Birgit Pauli-Haack: Let’s do it. It’s 148 PR. Is not as much as 19.6, but that was with 46 contributors and six of them were first timers. The release had 26 enhancements and 49 bug fixes. Bug fixes are a big, big piece of every release. And of course, I have in the show notes both the release posts and we can go into the enhancement. Do you want to start us out?

Enhancements

Anne McCarthy: Yeah, I would love to. Now in the preview dropdown, the device preview dropdown, there is an option to show template. And before this was available in the setting sidebar, but it wasn’t super discoverable. And so this is just adding it there as well. Whenever you want to actually see a template preview, this option is now there whenever you’re trying to review your content.

And I think this is one of those things that again, I am very curious to see how the feedback lands and how folks feel about it. If it ends up making sense to folks. We’ve added various things into that device preview dropdown. Including zoom out originally was thought of as being in the device preview and that was eventually moved. And I think this makes more sense conceptually. I was against zoom out being there, but I think having a template preview is a neat way to have a what you see is what you get. You may not need to go see the post in a new tab if you can just toggle this on and off to show or hide template.

And I don’t know, for me personally, whenever I’m writing or creating stuff, I often start with having the template gone. I don’t want to see it. It’s a distraction. And then whenever I’m ready to see, “Okay, how does this actually look in context?” You can toggle that on for show template. And I think it’s a great small enhancement that can help with usability and curious to see how people like it and use it.

Birgit Pauli-Haack: Absolutely. Yeah, and I’m really curious what people are going to do with the… Because the preview dropdown has been opened. There’s an API now for plugin developers to put it in. And I saw people put in view this in your newsletter because they use the block editor for the newsletter. And I also have seen it in I think blog visibility, what’s it on the front end when you have… The plugin block visibility by Nick Diego has an option to see it what is it that I showed. Where you can show and hide things. And he was able to manage the canvas to actually show and hide things quite easily. Yeah. It was really interesting what plugin developers are going to do.

Anne McCarthy: Yeah, I agree. I think it’s the preview options API, I just was looking it up to make sure I had the name and was available in 6.7. I think it’s a pretty cool… The accessibility there feels pretty powerful.

Birgit Pauli-Haack: Absolutely. Yeah. And this is, the next thing is more like a PSA so to speak, that the view external link that is in the toolbar on top is actually now at the end of the editor header controls. It got moved, so don’t be confused. It’s now on its final place for now until we move it again. But yeah, I think the zoom out button or link made us think a little bit more about what is the order of those things. And it would really help to get some feedback on it. What do you think about it? Yeah, just don’t miss it. It’s there. You just need to look a little left on it. And the next one is, can you talk about that?

Anne McCarthy: Oh, yeah, I would love to. There’s situations where there’s a post, you’re writing a post, you have a number of images in the post. And let’s say you want a quicker way to just set a featured image. There’s now an option where if no featured image is set, you can set any image to be the featured image.

Birgit Pauli-Haack: That’s cool.

Anne McCarthy: Yeah, it’s really cool and it comes from this desire to make it easier for folks whenever they’re in the flow of writing things. And as we know, images are really powerful. If you switch themes and you don’t have a bunch of featured images set, it can be a pain. There’s a lot of broader thinking around this. This is just an initial iteration to make it really easy to make sure to just set an image as a featured image.

And so, I definitely plan on using this. Because I always am reusing… I’ll post a blog post, I have a gallery of images, I love taking photos. And then I have to go again and select the featured image and go through the media library and all sorts of stuff. And now instead I can just be like that one, I want that one as a featured image. Through that, set as featured image. And so it just uses the same set as featured image property as it’s used elsewhere in the system. It’s also really cool use case with that. I’m excited to see it.

Birgit Pauli-Haack: I have two questions about it. One is if I set it as a featured image, then I can take it out of the post because it’s a different storage? Yes. Okay.

Anne McCarthy: I think so. Yeah. I think it’s basically it’s an attribute that’s set. And so, if it doesn’t have a featured image, it’ll be set as a featured image of the post. And you can also, if you override that and set the featured image, I’m pretty sure then that will be the priority is whatever is set as a featured image in that flow.

Birgit Pauli-Haack: Most of the time or sometimes the theme supports featured image in a blog post. Then if you take an image that’s in the canvas as a featured image and it still stays in the post, then all of a sudden you have a double in there. It depends on how the theme works or how you set up your templates for the single post. If that’s a trained method now for you, yeah, you probably want to switch off the display of the featured image on the single post.

Anne McCarthy: Yeah. Because that is such a… I right now have a theme that has… It does duplicate and I just decide to accept it. And I often, because block themes are so powerful, I’ll just go on a site editor and make sure that it looks good or looks separate and doesn’t feel too, I don’t know, annoying, where it’s like the images are just right after each other. And that’s one of the cool things with block themes is you can always just edit it or straight up remove it from your template if you want.

Birgit Pauli-Haack: Yeah, it’s fascinating what you can do, what you couldn’t do before. Yeah, yeah. The next two are other ones of getting more support for blocks. That’s the post content. Block now has border support and spacing support. And the details block also got anchor support. You could have the header of the details block be an anchor so you can link to it, which is very powerful. 

Anne McCarthy: Oh, this is a big one.

Birgit Pauli-Haack: Yeah.

Anne McCarthy: Yeah. Can I talk about it? I’m obsessed with.

Birgit Pauli-Haack: Yeah, talk about it.

Anne McCarthy: Okay. I’m going to tell the story of the background of this. When the site editor first was launched and people would drop into the editor, the site editor and start building, they would stumble on this style section. And a lot of folks thought that they were just styling their template. Whatever they were looking at, it was like, “Oh, cool, I’m styling just what I’m seeing.” And it’s actually styling everything.

The style section when you’re in the editor is styling everything, whether you can see it or not. And so this was almost like an information architecture problem, a UX problem. And to help start to alleviate this and to communicate the global nature, the same styles experience you get when you’re in the editor is being moved to the top level in that dark sidebar. Designers call that the frame. The frame of the experience or that dark sidebar before you get into the canvas and the editor.

It’s being moved to the top level. Whenever you first enter the site editor, you’ll see those same sections that you’re used to seeing. And when you hit styles, it’ll actually bring you in using data views. This great view of all your styles experience that you would expect whenever you’re actually in the editing experience. And the hope is that this will allow folks to understand that it’s like you’re editing everything. And in line with the other changes were done to allow you to toggle between the style book and previewing your site. And so, I think it’s a really exciting way to see when you first are landing there. I’m pretty sure it’s in 19.7. There’s basically a new landing section that’s added to the style book. I’m 99% sure I’ve tested this a ton.

And there’s also in line with this, there’s some upgrades to the style book. The style book is a bit better laid out. And then there’s also this landing section that basically pulls the most important information from your theme related to styles so that when you get there you get this sense of like, “Okay, this is the styling of my site, these are the colors, this is the typography.” And it just is meant to be a clear, easier to understand experience that you’re impacting the entire site.

And with that said, you will still have access to styles when you’re in the editor, so it duplicates it. And I am really curious to get feedback from folks because I think this is going to be confusing. I think folks are going to see the same thing and think, “What’s the difference? Is this the same? I’m not really sure. Is this for the entire site and this is for the template.” And so that’s one of the things that’s part of the beauty of iterating in Gutenberg before a major release is to get that feedback.

And part of the reason to keep it in the editor is for block themers who will want to be making changes while they’re editing templates and not just necessarily at the high level. There were a couple of different use cases to have to accommodate there. And part of the issue that we can figure out is what does the user experience look like between the two? How do we connect the two experiences?

Maybe when you open styles in the editor, it automatically brings you to that view. I’m not really sure, but there’s ways that design thinking can be applied to this. I’m really excited about this. This helps to solve, it starts to solve a long-standing issue around communicating styles as global styles, styles as impacting your entire site. And it just brings that sidebar at the top level to be a bit more useful. And so I’m obviously way too excited about this.

Birgit Pauli-Haack: No, no, no, no. I’m really glad that you explained it. Also, the whole genesis of it because I remember those feedback from the FSC program here that people are… And I always attributed to that there’s another level of abstraction and another level of design coming with the templates where users never had access to it so they didn’t have to learn that new concept. That stumbles them, but there is a way to actually alleviate that from the user experience. That’s brilliant. And I’m really happy that it also ties the style book of it.

What I saw was if you go through the styles in the middle section and you change the color palette in the style book, then in the right hand side, you can then see how that affects every single block or every single… Yeah. You can actually really make decisions about if you wanted that or do you need to do some additional adjustments there. The style book gives you a whole good overview. And it was always a little bit off site if you… It was hard to discover and now it’s right there for you to see. Yeah, so I’m really happy about that.

Anne McCarthy: I’ll share a little sneak peek. I was talking with some of the developers yesterday about this. But some of the work also to bring this to the top level, have it be like that is to then expose it for classic themes. Can you imagine a style book for classic themes and this landing section for classic themes?

The benefit, and this again goes back to phase two and gradual adoption and how important it is that we have these on ramps and ways of bringing some of these new features to everyone who’s using WordPress. And so that’s a PR in progress expected on a future Gutenberg Times episode. And all block themers out there and all themers in general out there, this is a great area to give feedback and to see how it works with your theme.

Birgit Pauli-Haack: Yeah. Yeah, the style book. When I was implementing some Gutenberg sites in the early days, 2018, I would create a post with all the blocks in there so we could, together with a client, look at how everything’s going to look from the theme point of view and where adjustments need to be made. But that was a major effort to put all the blocks in there. The style book is such a great tool. And bringing that to the classic theme is definitely a great way to foster adoption. Also to make the life of a classic theme developer a little bit easier doing that.

Anne McCarthy: Yeah. We got a lot of good feedback from folks being like, “I want this. Why can’t I use this yet? How can I use this?”

Birgit Pauli-Haack: It’s the best thing that comes with Gutenberg and, “I need it.” I can totally.

Anne McCarthy: And I love that feedback loop. And then one of the things, the next thing to think about is what does that look like to expose it in the appearance menu? We have patterns, do we have a style? And then what about the font library? Where’s the order of things? These are things that are on my mind. It’s like, “Okay, do we have them all separate? When do we bring them together? What does that experience look like for exposing these things?”

Birgit Pauli-Haack: Yeah, the holistic approach to design is so important. Yeah. But that’s the whole story about Gutenberg. You need to first do the small things so you can do it in context with the big things. And it’s really a little slow to go from the small things to the big things when you do something new. The iteration and the feedback loop is really, really important.

Yeah. Here’s your landing section for the style book is the next one. Next item on the style book tab. Then the next one is something that surprised me a bit, that we have now an exposed filter in the drop down for the individual image on select or upload media that says, “Okay, filter the medium about uploaded in this post or unattached pictures or to show me just my pictures.” Yeah. It’s filtering down to something that we were never exposed to before and it’s really an enhancement of the media library for this Gutenberg section. Yeah.

Anne McCarthy: Yeah. And I’ll note that this actually really nicely ties into phase three. I know it doesn’t seem like it at first, but one of the things that whenever I talk to enterprise folks, imagine you are writing 50 articles a day. And you have photographers, you have media teams, you have all this sort of stuff. And you’re trying to add content, you’re trying to add media to a post.

One of the biggest things is, is this file in the doc already and is it attached to this post in any way? They need quick ways to identify very fast, is this already in here? If not, can I add it in? And because it helps prevent people from uploading the same image five times. This is something that starts down that path of thinking about media library improvements, the workflow related to it. And whenever you’re creating content in mass with lots of different people, how can you make it clearer and easier to quickly filter?

I’m so glad you called this out. I actually totally missed this. It seems like a smaller thing, but it actually directly ties into feedback that’s come into the project. I think it’s a cool quality of life improvement.

Birgit Pauli-Haack: Yeah, I can see that. Then especially the net has become so much more visible, visual that you need the pictures or the videos or the audio a little bit more sorted so that’s wonderful. Yeah, so I think we’re through the enhancements and I haven’t seen…

Anne McCarthy: Oh, I can point out one thing that I think could be good.

Birgit Pauli-Haack: Yes, please.

Anne McCarthy: We were talking about this write mode, and this relates to this. This is like a bug fix. Write mode is exposed currently. And the plugin, it’s actually as of… I just checked the issue today that I opened. Between user testing and feedback, it’s pretty clear that it needs to be behind an experiment.

It’s actually going to be moved behind an experiment, but that will happen in 19.8. I’m pretty sure not 19.7. But in the meantime, to help reduce some of the confusion that we saw some folks running into, it basically makes it so that the tool selector between write and design is not exposed in the post editor. You’re only in design mode. And design mode, it shows all the tools. You can see everything, which is what you’re used to. Write mode offers that content only experience. It really just focuses on the content. It really… There’s a lot to figure out there, but I think of it as it contains the experience just to the purity of writing. It just is focused on the words. You can’t add a block, you can’t remove a block. It’s a very simplified editing experience.

And so, this basically has it so it’s only available in this write mode whenever you’re in the site editor. Which makes sense where you get that overwhelm and that’s where someone might just want to focus on the content of their template. But in the post editor, it doesn’t make as much sense. If you’re writing content, you don’t necessarily need to have these two different options. For 19.7, this is with landing. And then in the future, this will be put behind an experiment.

Birgit Pauli-Haack: Okay. Yeah, I think we should do a separate podcast episode about all the 15 experiments in Gutenberg.

Anne McCarthy: Yes, that would actually be a really cool episode. I would love that. I would be game for that. For sure.

Birgit Pauli-Haack: We definitely would need to do this on video because we’re going to demo things and all that. Yeah. Yeah. I will keep it in the back of my mind for next year.

Anne McCarthy: Do it.

Birgit Pauli-Haack: And we can do that. Yeah. Because we have until April until the new version comes out so there’s a lot of experiments that come up. yeah. The listeners, this was 16. 16. Yeah. 6.7 or 19.7. It’s 16.7. Yeah. Right?

Anne McCarthy: Yes. When you said it, it made perfect sense to me. I’m not going to lie. I was like, “Yep, that’s right. That’s true.”

What’s in Active Development or Discussed

Birgit Pauli-Haack: This was Gutenberg 19.7. And so we are at the section of what’s in active development or discussed. And we mentioned it before, there is these inline commenting that actually was almost entirely done by a group of contributors from a sponsored company called Multidots. And Pooja Bhimani, I hope I pronounced that right, is the lead on that. And they released the first and experimental version of inline commenting for the block editor. I think you were involved in that a little bit more heavily. Do you want to talk about this a bit more?

Anne McCarthy: Yeah, I would love to talk about it. I think it’s a great example of a wonderful contribution story for a really big feature. And the team over at Multidots reached out and they built a number of collaboration tools within their plugin and naturally wanted to help Core. And so this was where they decided to jump in. And right now they have shipped an initial version of 19.5, I think is what it got into, for inline comments.

And what it does is block level inline comments. You can comment on an entire block and you cannot comment on a sentence within that block. It’s an initial prototype to get some of the kinks out. And Ella, one of them, EllaTrips I think is her GitHub username. 

Yeah, long, long, long time WordPress contributor and Core contributor has been really helping there as well as Riad and Joen and design. There’s just been a lot of beautiful coming together to move this feature forward. And it’s basically in a state where they’re both starting to chip away at some of the minor bugs, like, “Okay, these are obvious things to fix.” And then they’re going to work on implementing a new design.

And so there’s some really cool designs on there, both for the short term and thinking really long term. I actually have a post I’m hoping to share today, sharing an update about all these different phase three areas. And this is just one of those big areas to keep in mind and to follow. There’s a lot of momentum and there’s a lot of work being done there. And Multidots has done a great job.

This is a huge thing to jump into as a first contribution. And so huge kudos to them. This is not an easy task. I think they’ve been working on this since April of this last year. It’s been a huge effort to come together. And it’s been really fun to work with them and to watch them develop directly in the Gutenberg plugin and land something and iterate.

And that’s part of the cool thing with the Gutenberg plugin and with the… It’s an experiment right now, so you have to turn it on under Gutenberg experiments. But expect to see more to come there and test, a call for testing from yours truly eventually. I’m hoping next week. That’s one of my top priorities for next week and this week is to get that announced update post out about the different areas of phase three.

But yeah, I’m really excited about it. I think it’s a cool thing if you’re a small editorial team to try it out. If you’re a plugin author, think about how you might want to extend it. All that workflow collaboration head space, this is one of the first meteor things, or probably the second meteor thing that’s land other than data use, which is a huge thing. I just completely… Data views is the first, this is the second. And so, I’m really excited to see some of these phase three features that are really tangible begin to get out into the open.

Birgit Pauli-Haack: Yeah. Well, I’m glad you bring this all to us. And I think we are all… Yeah, test it all out. Did you say you want to post it today or tomorrow?

Anne McCarthy: The update for phase three will be today. I want it out today.

Birgit Pauli-Haack: I will bring it into the show notes.

Anne McCarthy: Perfect.

Birgit Pauli-Haack: … because we are not going to publish that until Sunday. Today is Thursday, so it’s really good. I’m going to share it in the show notes. I think that’s an update on the real collaboration on commenting and interviews. I’m very much looking forward to reading that as a whole. 

All right. This is, we are at the end of the show today, although with two plugins and Anne here, we have a great show. And next show would be in two weeks with Sarah Norris and it will be the last of 2024. And then I’ll go on vacation. Yes.

Anne McCarthy: Good. Good. Love to hear it. You got to rest. Congrats on over 100. I cannot believe you have over a hundred episodes of this. That’s really incredible. I keep thinking about that at the beginning of the show. I think that’s so cool.

Birgit Pauli-Haack: Well, thank you. Yeah. I couldn’t have done it without you and all the other guests that are here that bring their brilliance to here. Because I only see one side of things and having other aspects of it makes it so much richer. Dear listeners, as always, the show notes will be published on gutenbergtimes.com/podcast. This is episode 111.

And if you have questions or suggestions or news you want us to include, send them to changelog@gutenbergtimes.com. That’s changelog@gutenbergtimes.com. And I want to thank you, Anne, for taking the time tonight to be with me and walk me through things and share your insights with everybody. Thank you all for listening. Goodbye.

Anne McCarthy: Goodbye. Thank you for having me.

Leave a Reply

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