Gutenberg Changelog #86 – WordPress 6.3, Gutenberg 16.2 and Phase 3 Collaboration

Cover Art: Gutenberg Changelog
Gutenberg Changelog
Gutenberg Changelog #86 - WordPress 6.3, Gutenberg 16.2 and Phase 3 Collaboration
Loading
/

Sarah Norris, JavaScript developer and 6.4 editor tech co-lead joined Birgit Pauli-Haack on the Gutenberg Changelog for the first time. They discussed WordPress 6.3, Gutenberg 16.2 and Phase 3 Collaboration

Add a summary/excerpt here

Show Notes / Transcript

Show Notes

Special Guest: Sarah Norris

JavaScript Developer 6.4 editor tech co-lead

Community Contributions and Announcements

WordPress 6.3

Gutenberg 16.2

Phase 3: Collaboration

Stay in Touch

Transcript

Birgit Pauli-Haack: Hello and welcome to our 86th episode of the Gutenberg Changelog podcast. And today’s episode will talk about Beta 4 6.3, Gutenberg 16.2, and the first posts about what to expect for phase three on Gutenberg. And I’m your host Birgit Pauli-Haack, curator at the Gutenberg Times and WordPress developer advocate, also full-time co-contributor to the WordPress Opensource Project. And I’m here with my friend and colleague, Sarah Norris, JavaScript developer on the themes team, core contributor and co-tech lead for the release in 6.4. So that’s in November, but we are starting now. Sarah and I danced a good two hours at the Pride Party in Athens, and we had great fun. I haven’t danced that long for decades, so thank you so much for joining me on the show today, Sarah. So, how are you?

Sarah Norris: I’m good, thank you. Thank you so much for having me. That pride party was super fun. It’s a beautiful setting on a rooftop bar in Athens. Yeah, beautiful weather and I got so many steps in, I tripled my step goal.

Birgit Pauli-Haack: Yeah, I did too, but not as much as I did the first day I was in Athens when I went up the Acropolis twice.

Sarah Norris: Twice, yes. That’s a big hill to climb twice.

Birgit Pauli-Haack: So, if you do it twice, you get a lot of steps in. I think that was the day I had 17,000 or so. 

So, you’re working on the Gutenberg Project. And so, when you think about 6.3, what excites you the most about what’s coming up next month?

Sarah Norris: Yeah. There’s so many exciting updates, especially around enhancing the UX of the site editor in particular, which is super exciting. So, one of my favorites is the command palette, because it allows people to search for different parts of the site, like navigation, pages, style variations, templates, and it’s similar to Spotlight on a Mac or using Alfred. So, it’s a really quick way to access different areas of the site without you having to search through different menus. That’s a really cool update.

Birgit Pauli-Haack: Yeah, that’s a cool feature. Yeah, I like it too because now I don’t have to figure out which of the different editors I have to use to do stuff, so I cannot just ask that command palette. Yeah, open my page, or open a post, or edit a template, or something like that. Yeah, it’s really cool.

Sarah Norris: Yeah, exactly. Yeah. Another thing I’m excited about is the updates to the site editor sidebar. So, currently in 6.2 we’ve only got a list of templates and template parts, but 6.3, it’s going to look a lot different. Oh, well, it’s going to look similar, but there’s going to be a lot more items. So we’re introducing… there’s navigation styles, pages, patterns as well. So, I guess similar to the command palette, it gives you a lot more options to access those other features quickly. So, if you are already in the site editor context, you’ve got more options to get to other areas a lot quickly.

Birgit Pauli-Haack: Yeah, yeah, I like that too. Especially the part where I can edit my page content together with my page templates, so I can just switch that and say, “Oh, that’s a template, I want to do for…” Yeah and, “Oh, and now I need to fix something on one of the pages,” and I can do it all from the site editor. I wish I could also do posts from there, but I guess maybe that’s coming, maybe not. Yeah.

Sarah Norris: Yeah, maybe it’s coming.

Birgit Pauli-Haack: Anything else?

Sarah Norris: Yes, so I guess specifically on the pattern section, this is now where template parts are going to live. So, sometimes I guess if people are already using the editor and the following along with updates, this can be a little bit maybe confusing or it’s just like, “Oh, I’ve just got used to template parts. Now they’re patterns.” But I think it’s a really good change for new users because it’s less terms to use templates to template, and then there’s patterns. And especially with this refocus on patterns, it’s a single word we can now use. So, maybe we had a few other words before. And so yeah, any reduction in terms is a win.

Birgit Pauli-Haack: Yeah. Cool. Yeah. Yeah, that’s in line with also renaming reusable blocks to pattern. They’re sync patterns now. And then template parts are patterns. They are reused, but they’re reused in the templates. So, I think what will round it all up later on is when we have partial sync patterns. So, when you use a pattern on a page and you want to change the styling or the color that it kind of changes overall the patterns of all the time that you use that pattern, but with different content. So yeah, that is still a piece that’s missing, but I think the foundation needed to be there with kind of figuring out it’s all the same, just a little bit different. Reusable blocks and patterns and template parts, they’re all the same soup. It’s just different flavors. Yeah.

Sarah Norris: Yes. Exactly. Yes.

Birgit Pauli-Haack: And I think you’re right. For a new person coming to WordPress, it’s much easier to figure out.

Sarah Norris: Yeah. And anything we can do to speed up that understanding as well, it really helps gives you a boost to understanding how to use the site editor. I think it also… that this refocus on patterns helps building block themes much easier as well. And it highlights how we can create a variety of different layouts across themes. So, patterns they can be just part of one theme, but other patterns can be part of any number of themes as well. And it really highlights how themes are a collective of different aspects rather than just a single topic asset as they might have been in the past. And yeah, I love that. I’m really looking forward to different people trying that out.

Birgit Pauli-Haack: Yeah. And having certain parts of your site being your site, not depending on the theme, I think that’s the next level that wasn’t before possible in WordPress. Yeah. So, it’s an interesting… that templates can be different from the theme, and that kind of blows my mind right there.

Sarah Norris: Yes. It’s a whole new layer.

Birgit Pauli-Haack: Whole new layer and whole new complexity. But yeah, I like it because for a user, it doesn’t really matter if it’s a theme-related pattern or their own pattern. But they will be surprised when all of a sudden it goes away.

Sarah Norris: Yes, exactly.

Birgit Pauli-Haack: The theme, yeah.

Sarah Norris: Yeah, exactly. Yeah. So, now that’s different. Yeah, it won’t go away. Yeah.

Birgit Pauli-Haack: Yeah. Anything else that excites you?

Sarah Norris: Yes, there is something actually that I really wanted to mention. So, for Beta 4 that’s just been released, there’s some major performance boosts. So, they’re all going to come out with 6.3. So, there’s some major performance boosts, both classic and block themes. And for both client side and service side, it means a significant boost for the largest content for Paint or the LCP metric, which is basically when the page’s main content has likely been loaded. So with 6.3, there’s going to be a reduced LCP of 26% for block themes and 19% classic themes. Yeah, so that’s massive.

Birgit Pauli-Haack: Oh, that’s pretty big.

Sarah Norris: Exactly. Yeah. But it matters so much as well, because it’s so many websites this will roll out to. Yeah, I really wanted to highlight it because it’s something to really shout about and celebrate.

Birgit Pauli-Haack: Yeah. So, when you upgrade to 6.3, all of a sudden your sites are faster, almost 20%, even if you’re on a classic theme. So yeah, that’s definitely a boost. And you don’t have to do anything. It’s all for free.

Sarah Norris: Yes, exactly. Yeah. Yeah. It’s automatic, automatically performance boost.

Birgit Pauli-Haack: Yeah. Depending, of course, what plugins you use and what the theme does, but yeah.

Sarah Norris: Yeah, yeah, base level, base level performance.

Birgit Pauli-Haack: Base level. Base level, yeah. There are always edge cases and we need to be aware of those and that they might happen. Yeah. All right. Yeah. Cool. Yeah, that’s a lot of things to come. I really like that the footnotes block made it into 6.3. It was a little late on that, but it definitely comes, and there is a certain corner in our community that actually has been waiting for that for many, many years. So, now it’s here.

Sarah Norris: Yes. Yeah. That will be major for certain aspects of certain different types of articles that people use WordPress for. Yeah, footnotes, I can imagine people have been waiting for that for such a long time. So yes, it’s great.

Birgit Pauli-Haack: Some of them are still kind of hand-coding all the pieces together.

Sarah Norris: Right.

Community Contributions

Birgit Pauli-Haack: So, in a similar way, and I wanted to highlight a community contribution from Justin Tadlock. He has had a plugin in the repo for a long, long time that deals with breadcrumbs, and he migrated that into that it’s block-based now. So, you can have a breadcrumb block for your pages and archives, and it automatically will pick up the hierarchy of the nested pages, and you can change text color background, link color, and including the hover state, and also adjust the padding on the margins. And it has been submitted to the plugin repo. But yeah, there appears to be a two-month waiting time for new plugins to get approved. So, we will share it in the show notes the link to the GitHub repo, where you can just download the ZIP file from there. But I tested it, and I really like it. It helps me organize some of my test sites quite a bit.

And Justin Tadlock has been in the community for many, many years, so his code is solid. Yeah. So, I share that with you. I wish there was something similar in core, but this is the next best thing. So, let us know what you think about it.

Beta 4 of WordPress 6.3

So, that brings us to our section, What’s Released, and as you mentioned, Sarah… Sarah, mentioned it before, the WordPress 6.3 Beta 4 was released this week, and it’s really coming down to the wire. So, if you haven’t tested your plugins, themes, and other customizations of your website, you should start testing now, because you have less than a month to fix things if they break. The final release is August 8th, and today we are recording on July 14th. Oh, by the way, happy Bastille Day in France. Yeah, so get on the testing part, and I have been saying this for now for weeks, but the more you test, the more we can find the bugs now and we can release a better product. Yeah. So, have you been testing WordPress 6.3 Beta 4?

Sarah Norris: Yes, I have. Yes. Yeah, I’ve got the Beta plugin installed, and yeah, I make sure I’m up-to-date default testing.

Birgit Pauli-Haack: Yeah. I have websites, one website that is actually using nightly, and when it’s release time, the Beta and release candidates in production. So, I know immediately when something doesn’t work as I do with the Gutenberg nightly that I use in production on certain sites.

Sarah Norris: Living on the edge.

Birgit Pauli-Haack: Yeah. Welcome to the life on the edge. But I actually hear that Matt Mullenweg is using the WordPress nightly on his blog as well, so in production.

Sarah Norris: Yes.

Birgit Pauli-Haack: So yeah, there’s a lot of trust coming out of the team, and it’s well warranted. The team that is releasing 6.3 has been stellar, like all the other ones. And there was a little hiccup for Beta 1, but Beta 4 was smooth. It was done in 58 minutes. That, I think, is a record. Well, it’s definitely very, very fast. Sometimes it takes about 90 minutes, so it comes really down to the wire. So, if you find something, say something.

Sarah Norris: Yeah, definitely. Well, I think what’s really impressive, when you’re doing the Beta parties and with the testing, usually the bugs are found… And I’m touching wood as well, because I don’t want to tempt fate to any large… but the bugs that are found, they’re either hard to replicate or hard to find. So, they’re small bugs, and I think that’s a kudos to the team that are involved in that the bugs aren’t that visible. There’s rare cases, but generally speaking… So, I think if you’re helping to test as well, even if you find a bug that you think maybe it doesn’t matter too much, just mention it because that’s what the team is looking for. They’re usually the bugs that are… Like I’m looking at the change hub for Gutenberg, and the bug fixes. They’re all the little edge cases to make sure it’s really polished. Yeah, I’m always impressed with that. There’s no really major visible bugs. It’s always the little ones.

Birgit Pauli-Haack: Yeah, it’s always the little one. And then, it’s also what kind of gets it done. Well, it’s like everything else in life. It’s the little things that make you happy and that make you aggravated.

Sarah Norris: Exactly.

Gutenberg 16.2

Birgit Pauli-Haack: Yeah. And that brings us to Gutenberg 16.2 release that happened this week. There were a hundred, again, 184 PRs committed by 47 contributors. That’s a lot of change coming in in two weeks period, given that 16.1 had 255 PRs to go through. So Sarah, you’re in luck; you only got two-thirds of what we did last year.

Sarah Norris: Yeah, that’s true. I should be grateful.

Birgit Pauli-Haack: Do you want to start, get us in there?

Enhancements

Sarah Norris: Yes. Yeah, so the first one we’re looking at, so this is rename reusable blocks to patterns. Yes. So, this is renaming reusable blocks to sync patterns. So, this is to align with the new editor terminology that I guess we’ve just touched on. So yeah, so a sync pattern is any change made to one pattern that gets deployed to all instances of that pattern across your site. And then the opposite would be an unsync pattern. And so, they’re included in the inserter with all your other patterns, but changes to these patterns will not be reflected throughout the site. And then, that means you can customize each instance of that pattern. Yeah, again, it’s a wording, a terminology update, but I think it really aids the UX of the site editor in general.

Birgit Pauli-Haack: Yeah, but what it also brings, and I’m very delighted to say, is that you now can actually create patterns on your site. Up until now, you were reliant on themes or on the community patterns from the pattern directory to get patterns, or you had to write them in PHP and then upload it to your site. But now you have the same interface or the same workflow with which you created reusable blocks or now sync patterns you can now also use to create unsync patterns. So, you have much more… the user has much more freedom to create some reusable blocks and some reusable sections of the site that can then be further customized or not. Yeah so, I think there were a lot of people waiting for that part because not everybody touches code or has somebody around that can touch code. So, doing it in the interface is really… that’s actually the big win from the name change.

Sarah Norris: Yeah, yeah, exactly. That’s exactly it. And yeah, anything that helps the low-code or no-code ability around the site editor is fantastic. It really opens up WordPress to so many new users, and I’m really looking forward to seeing hopefully just personally more designers using WordPress as well, because there’s so many beautiful designs out there already. So yeah, I’m really looking forward to beautiful design patterns increasing as well.

Birgit Pauli-Haack: Yeah, me too. And I saw in the theme directory just as a side, quite a few new themes, block themes, that were done by contributors that haven’t done a theme before or that haven’t even contributed before. And that is such a great development with that. I really love that to see, even if it’s simple or to get the feet wet and get through the whole process of getting into the theme directory. I think that’s another hurdle by itself, but once they made it, it’s much easier to get the second, third, and fourth theme into the directory. But that was just a side note. So the next feature from 16.2, I’m doing it again, 16.2 is the rename of command center to command palette. It’s not a new feature, but it’s kind of the name change is really following what…

There was a big discussion on GitHub, and I think that is where the most consensus came around, that command palette is something that is translatable, is relatable, even for non-native English speakers. And we talked about it, how excited we are about it, both the renaming of the reusable block to patterns and the rename of the command palette. It all will be in 6.3. So, when people ask me what features from Gutenberg will be in 6.3, I would say 15.2 release to 16.1, but I think that’s a lie. I think it’s 16.2 beta sections from 16.2 Gutenberg release that all actually made it into 6.3, especially the whole thing around the site editor library, and the sync, and all that. Yeah.

Sarah Norris: Right. Yeah, I think it’s a good name change as well. I think it’s a term that should be localized fairly easily. It’s important. Okay. So, this is the library adding sync status to the pattern details screen, and so this is really cool that can be expanded on in the future to include more details as well. So, this shows the sync status of a pattern on the pattern details screen. So, it’s either going to say not sync or fully synced currently at the moment. But this can be expanded to include further details about the pattern, things like the author who made the pattern, maybe where the pattern’s being used across the site, so things like template names or pages or posts. So yeah, I’m really excited about the potential here, but also the feature that’s being added in 6.3, it’s super helpful, just the information being there so easily. It’s great. Yeah.

Birgit Pauli-Haack: Yeah, so there was for a while, the last item on the menu in the site editor on the left-hand side was called Library, and had template parts and had patterns. And that has also been changed to patterns, because everything that’s in there is actually, per se, a pattern and Library was too big. There were thoughts that maybe they put the fonts in there or some styles or something like that, but that didn’t pan out. It kind of is all… It’s the second shoulder for the patterns, and everything else will be in a different heading there. So it’s the reusable blocks, the sync patterns, the template parts as well as the unsync patterns. Yes.

Sarah Norris: Yes. Yeah.

Birgit Pauli-Haack: And there will be a section in that menu item called My Patterns. So, these are the customized patterns that you did that were created with the UI and on site. They’re not coming from scenes, they’re not coming from plugins, they’re not coming from code. They come from your interaction with the interface, and you build them all yourself. So, it’s all yours. It says My Patterns, but it’s yours. It’s kind of funny.

Sarah Norris: Yeah. Again, that’s another really good UX terminology update that I think helps, but I guess primarily new users, because unfortunately if you’ve been used to the terms, you get reuse to the terms, but that’s all good. It’s part of working in an open project with lots of different iterations all the time. And new users, they get the benefit.

Birgit Pauli-Haack: Yeah, yeah. I don’t know. With a 20-year-old project, how long does it take until you are not a new user anymore, or how many new users does it take to take over the majority, but then longer than… Well anyway, so any user will have an advantage about it. For some of us, we need to relearn things, but we have an active mind, and we can relearn things because these are small changes. It’s just a little vocabulary kind of thing.

Sarah Norris: Yes, exactly.

Birgit Pauli-Haack: Speaking of which, we are not done with the name changes, are we?

Sarah Norris: No, no. There’s another one, but another really good one as well. So yes, there’s been a change, changing the Home template name to Blog Home. So, this one is for templates and touches on something that’s been around a little bit longer than patterns, I suppose. So, the name Home suggests that the template will display the site homepage. So, this is true when the reading settings of the site are configured to display the latest posts on the front page, but if there’s a static front page, then the home template will display the post page, not the homepage. So, this is where the confusion lies and has for a long time as well. But for block themes, it’s more easily surfaced, especially to people who aren’t deep in the code.

So, the renaming of the home template in the site to Blog Home is a lot more descriptive what it’s actually being used for, whilst the template file name is still home.html. So, that still is a parallel of home.php. And so, it’s still exactly the same in the template hierarchy. It’s just the visual name that’s been changed. But again, I think it’s particularly useful for low-code or no-code users. It’s much easier to understand, and it just reemphasizes that it’s going to be used for the blog and not always the homepage. We’re not completely fixing anything here, but it’s certainly the start of hopefully addressing this issue that’s been resurfaced to no-code is basically… So yeah, I’m really excited to see if this does help and see what journey it takes us down into addressing the homepage confusion. It existed for a while.

Birgit Pauli-Haack: Yeah. And the way you explained it, I actually understood.

Sarah Norris: Cool.

Birgit Pauli-Haack: And I finally got the trigger that, “Oh, okay, now I got it.” But now the question for you, if I use the setting that I want a static page, then it just displays the page, right, from the page template that I designate as the front page, as the homepage.

Sarah Norris: Yes. Exactly. Yeah. Yeah. Yeah. And you just have to be aware that that’s changing a template. And again, we could probably add some additional helper functionality in the site editor to help people understand that, because currently you have to jump out into the WP Admin, into the settings section, yeah, into the settings. So yes, I think we could maybe surface that in different areas, but then when I start to think about it, it also gets more confusing. But I’m sure we’ll figure out a way to make it make sense, because there’s additional confusion as well with the existence of the frontpage.html template, and that takes precedence over any other template to be the front page.

And so, obviously you can use that to your advantage if you want to be a really opinionated theme and say, “This is always going to be the front page. This is definitely the prettiest version of the patterns I can put together.” But then, because it’s so opinionated, always is the front page, it can be confusing to users who are trying to not make it the front page. So, there’s just additional legwork or additional click to get around it not being that template.

Birgit Pauli-Haack: Yeah. Yeah. And then there is a front-page.html.

Sarah Norris: Yes. Yes. That’s the one I’m talking about. But yes, there’s also index. So, there’s home.html, which is the one that’s been visually renamed. There’s front-page.html, which is the one you just mentioned, and then there’s also index.html, which to anyone who’s worked with the web before, it’s hopefully the most easy to understand because it’s the index. But again, to non-coders, it’s just a third thing that could also be your front page, and that’s always the default. If nothing else exists, it’s index. But yeah, I understand how it can be really confusing. I mean, if you’ve ever looked at the WordPress template hierarchy page in the documentation, I think it’s fantastic because a really good visual map, but then the first time I saw it, I was like, “Oh, wow, there’s a lot of mapping going on here. There’s a lot of different options to choose from.”

Birgit Pauli-Haack: Yeah, indeed. Indeed.

Sarah Norris: It’s a good challenge to have, I think, in the site editor. Yeah, I think we can fix it in many different ways. And yeah, we’ll get there.

Birgit Pauli-Haack: Yeah, and you just reminded me, we have on the developer blog, one of the early posts was about the template hierarchy.

Sarah Norris: Oh yes, I remember. Yes.

Birgit Pauli-Haack: Yes.

Sarah Norris: Yeah, it was a really good post.

Birgit Pauli-Haack: … demystifying home and post templates in WordPress theme development. And I’m kind of putting that link into the show notes fully knowing that it was before the name change.

Sarah Norris: Yes. I think that’s okay.

Birgit Pauli-Haack: We need to review the post, so we can make sure that that’s the same with a new name change there. Cool. Yeah, that was an excellent article by Daisy Olsen, and had some great examples and screenshots there. Yeah. Excellent. So, what else?

Sarah Norris: I think the next thing was introducing more welcome guides. So again, I think this is a really good UX update. So, this is adding welcome guides to the page content focus and template focus, so the little well-designed models that pop up when you jump into different areas of the site editor. I think it’s easy for you users to be confused on… what you mentioned before… new users to be confused on whether they’re editing a page, editing a template, how the template influences the page, and vice versa, and which context they’re used in. So yes, so this is a great way to introduce people to the differences.

Birgit Pauli-Haack: Yeah, it’s also a good way for those of us who are new to this new site editor experience, and that’s also a new user, but for the first four years we were kind of trained to just click away the welcome guides because it hasn’t had anything new and it didn’t remember our choices. So it will come back, but it’s coming back with new content. So, read it a little bit because it helps you get over that hurdle, “Where am I and what am I doing,” quite easily and has some nice animations in there. I really like them, and they are hidden under the acronym NUX, and yeah, that’s new user experience. I always thought there was something like NPM and NPX and NUX. It’s all the same JavaScript library kind of thing. No, it isn’t. It’s new user experience.

So, I read over it quite fast until I saw the words “welcome guide,” and I said, “Oh, there’s new content there.” And I checked it out and I really like it. And I learned a bit. If you want to get started quickly and not have to read through all the changelog and all the posts that are coming out, use the welcome guides. But we hopped over off something on themes, like add border and theme support, border theme support and link color theme support. That is a new thing that, actually, it was fixed in WordPress core, but needed to be synced up with the Gutenberg plugin. And you said you worked on it. What exactly had happened?

Sarah Norris: Yeah, I’m not sure what you’d call it, if it’s not a back foot. It’s like a forward foot.

Birgit Pauli-Haack: It’s a sync. It’s a sync.

Sarah Norris: A sync.

Birgit Pauli-Haack: A kitchen sink. It’s a sink.

Sarah Norris: Yes, sink. Yes. So, this is previously the border and link theme support. They were named experimental. So, this update basically takes out the experimental. Yeah, that’s essentially it. But yeah, it’s a really good update because I think the word experimental can be scary to anyone who’s included APIs in new plugins or themes. So yeah, just the fact that it’s not there anymore is brilliant.

Birgit Pauli-Haack: Yeah, and that’s the support you said in theme.json for link color and that quite a bit. So, you have a UI for link color and border theme, border radios, border size, and border of the sides. So, you could have a left side and a bottom side border, but you don’t have a border on the left side or a right side and a top side or something like that. Yeah, so it’s really cool. The next thing is really cool and it’s not coming to 6.3. You need 16.2 to get it, and that’s that the typography, you can get some text orientation in a paragraph to go vertical.

Of course, you’re not going to do this for whole full paragraphs with multiple lines. You probably do this for a header or for a subheader or something like that. It’s not going to be in the heading block, but it’s in the paragraph block. But you need to enable it in the theme.json at all. And then it’s only available for paragraph blocks, so it’s still the early iteration, but I find it really cool. So, because it’s not in the heading, you could just change the font size of it to be a little bit bigger. You make it vertical, and then you can place it next to a paragraph in a group block row, and then you have some interesting layouts that you can play with. I find it really fascinating.

Sarah Norris: Yeah, it is a really cool change. I remember a site I made years ago, probably 20 years ago, where I was playing around with text being vertical instead of horizontal, and it makes for some really interesting design capabilities. Yeah, it’s a really cool update. It’s also enabled on post navigation links as well, as well as the paragraph block, so the next and previous post, because we can maybe…

Birgit Pauli-Haack: Oh, cool.

Sarah Norris: Yeah, lots of design flexibility with those, because I guess they’re usually on the sides. So yeah, that aids going vertical as well as horizontal.

Birgit Pauli-Haack: Oh, nice. Yes. Oh, I didn’t know that. Yeah. Excellent. Yeah, must have missed it when I read the PR. Yeah, you could also do it next to an image or something like that. And you have full control over background, margins, color, so it really puts it to use in your designs and makes something amazing.

Sarah Norris: Yes. Next up is the range control, so adding support for large 40-pixel number input size. So, I think this is a really nice visual update to the range control component in the editor, which helps land the UI for all components, because I think quite a lot of other components have been using this size. So yeah, it brings the range control into line and it affects the visual spacing around the number input for the range control. So, it’s much easier to read and use, and especially if it’s scanning to lots of components and settings, then yeah, it’s much more easier to read now.

Birgit Pauli-Haack: Yeah. And plugin developers can use it in their plugins as well. These are components that are available to any developer who uses the components, and now it’s an additional attribute for there to have some bigger numbers in there. 

New API

So, the next thing is a new API and it makes the new “register, insert a media” category API extensible, so other plugin developers can use it to organize the media categories. So, this is probably one of the things that people waited for almost 20 years about, that there is a hook to insert media categories into WordPress. Have you played around with it? Do you know how it works?

Sarah Norris: I haven’t played around with it, but I’ve read the updates though. I think it’s a great update, especially for plugin developers, because it allows them to register their own media categories. Then they’ll be displayed in the inserter, so it’s perfect for plugins that are adding custom blocks. Extensibility is at the heart of WordPress as well, so I think this is a really good example of that.

Bus Fixes

Birgit Pauli-Haack: Excellent. Yeah, so that brings us to one of the major changes, to TinyMCE deprecation. But don’t get scared; you still can use it. This change sets the path for the TinyMCE deprecation to update the experiments with a strategy to get the TinyMCE and the classic block not loaded automatically, but only when it needs to load. That definitely has a performance improvement. And right now it’s an experiment and needs to be tested, especially with the extensibility that is around TinyMCE that has been in WordPress for almost 20 years. But it’s also contained in classic blocks, and so the question is how it’s going to behave with whatever’s in the classic blocks and for Gutenberg. So, it’s not quite clear to me what the end goal is, but I think that is pretty much the end goal, to have TinyMCE not load automatically, but load only when it really needs to be loaded.

Sarah Norris: Yeah, I think that’s the end goal to fully deprecated TinyMCE, which would be a massive boost to the performance of the editor, which is really great to hear. I was playing with this before… Plus, a common use case for the classic editor was to insert HTML using the code editor rather than the visual editor, so how you can switch between the code and the visual editor. So this is still possible, but if you use the code editor to do this with this experiment enabled, you’ll see a warning that says you’re trying to use a deprecated classic block.

But what’s really cool is that it gives you the choice to convert the HTML to a custom HTML block, so using the new editor, or you can refresh the page to use the classic block if you prefer to do that. So, it gives you the option to do both, but converting to the custom HTML block is so quick. You just click the button, and it’s immediately there, and it just works as it was before. I think that’s really impressive, and I think it’ll help aid the transition to using the block editor as well.

Birgit Pauli-Haack: Mm-hmm. Yeah, I think we all need a little help once in a while to see how the good things are. To make it totally clear, WordPress is not abandoning TinyMCE. If you’re using the classic editor, you will still have access to it. It will be backwards compatible, and it’s just that the classic block in Gutenberg is maybe on the way out with a TinyMCE. But it’s a start of an experiment. So, it could be another year or two, or maybe only half a year depending on how the experiments go. But yeah, try it out and see what you think about it. In the changelog, there’s the PR, but if you want to write it down on the podcast, it’s 50387. That’s the PR that deals with it. And there was a lot of discussion there as well, but I found it important that we talk about it. I am pretty sure it’s not the last time that we will talk about it.

Sarah Norris: It’s the beginning.

Birgit Pauli-Haack: It’s the beginning. It’s the beginning of an experiment. What else was in 16.2 that we wanted to talk about? There’s a lot of bug fixes. There’s quite a few. Also, just a polish of copy and icons and all that. Global Stars Revision API. That is all for 6.3. I think we’re done. Are we?

Sarah Norris: Yes, I think so. Yeah, there are a lot of bug fixes though. I noticed there’s quite a lot of things like spacing updates to get a lot of the editor components in line, which it sounds like really tiny updates, but when you add them all together, I think it really aids the experience of the editor and it really makes a big difference, a good update.

Birgit Pauli-Haack: Yeah. If you get more clarity and more consistency in the design, that definitely makes a difference. 

Documentation

Yeah. So, I’m stopping just for a little bit at the documentation for the developers. There has been a push from Ryan Welcher to update some of the package documentation and add examples to the packages, so you know how they can be used and get started on using them without having to go through the source course and figure it out how you’re actually going to do the API there. And in this release, there was examples to the rich text package, to the keyboard shortcut package, and to the customized widget package. And I’m sure he’s working on more. There is a tracking issue in Gutenberg repo for these kind of updates. Another push on documentation is to add READMEs to some of the components that don’t have them because the examples and the README are automatically added to the handbook of the block editor. And if it’s in code, then automatically it will show up in the documentation.

So, that’s definitely a great developer experience update, and it can only do one at a time, but sooner or later we all get through that. 

Tools

All right, and the last thing I wanted to mention is there will be revisions of your style variations or your global styles. 6.3, the revisions for styles will be in there or are already in there. So, when you change some of your styles and you say, “Okay, the one that I did yesterday, I would like better,” you will be able to go back to that particular moment in time in your revisions and make that the current one. The team was also working on giving the same revision treatment to template customization, but that didn’t work well enough to get into 6.3. So, that is something that will be in 6.4. Template revisions are not yet; they’re still experimental. You can get them in 16.2 and work with them, but they did not make it into 6.3.

Sarah Norris: I think the style revisions are a really neat update, and actually the whole way you can view the style book now as well.

Birgit Pauli-Haack: Oh yeah, that’s a real cool thing. Yeah.

Sarah Norris: Yeah, it’s very cool, how fast you can preview the styles. But I really love how you can just switch the style book, and I don’t often hear it talked about that much. I think it’s a perfect way to test your theme. If you just open the style book, you can test so many aspects of a theme. And I think 6.3 is really highlighting how you can do this.

Birgit Pauli-Haack: Yeah. And there’s one other thing, it’s that you can preview themes. So, if you have downloaded a theme, a block theme, but you haven’t activated yet, you can actually preview that and also see it in the style book, so you see how your blocks behave with a new theme. I think that’s really cool. You can also see how your pages behave if you have certain designs on some pages or posts. Yeah, so the preview, that’s kind of getting feature parity almost with a customizer that was for classic themes where you also could do previews of themes with your own content. I think for many, many years that was really missing here in Gutenberg, and I really love that that’s coming to 6.3.

Sarah Norris: Yeah, it’s very cool.

Birgit Pauli-Haack: And that is the changelog of 16.2. 

What’s in Active Development or Discussed

We have a big section in the What’s Active Development and Discussed because Matias Ventura has started thinking very deeply about the Gutenberg phase three. He published in March a more global high-level kind of approach on that, and now he published seven or five or six… Six. Six posts on certain aspects of it. So, he covers real time collaboration, outlines the concurrent collaboration and shares edits that he envisions or that it’s not only him, it’s the whole team, kind of what they’re going to work on. And then the workflows, he discussed requirements for full publishing workflow that’s async in comparison to sync where both… where sync means two people can edit the same thing at the same time and the system is handling all the edits and async workflows means, “Okay, I go in today. Tomorrow my editor has some comments and I go in back and kind of work through the comments,” similar like Google Drive, but the whole content team.

So in most of the bigger sites, it’s not just one person publishing, it’s not just the writers publishing. It’s a whole team of media people, of video people, and they all need access to certain things and be part of the workflow and connect with each other. Right now, they do it outside of WordPress and somebody brings it all together, but we all hope so much to do this in WordPress. So, that’s the section of the workflows. 

And then we talked about it already with the styles and templates, the whole system of revisions, which is a little bit archaic right now. It helps you, but it doesn’t know anything about blocks, and that will get a full overhaul of the current system making blocks aware and having all the data layers available for revision so editors and admins can see things.

And the fourth one was something that a lot of people really want is an overhaul of the media library with media management capabilities and unifying the interface between the block editor, and the media library, and then also of course improve the overall media workflows. So, dive into those. We have links for all of them in the show notes. Then there are two more that came out this week. Those four were last week, and this week came two more. One is about block libraries and then one about the admin design. So, I did not get into reading all of it. I skimmed a lot, but how are you doing with catching up with the new things?

Sarah Norris: Yeah, I’m trying to stay up-to-date. I’m also skimming a lot. The new admin design really caught my eye though, because again, I think it really helps to bring everything in line into the same design using the same design system. It just really makes everything look polished. I’m so proud to work on such a good product like this when it’s all coming together, and I’m really looking forward to the admin update. I’m sure so many people are as well looking forward to another redesign.

Birgit Pauli-Haack: Yeah. Apart from that, it really looks dated like 15 years ago. So, when you look at the designs… And I will also share an article by Sarah Gooding from the WP Tavern, where she actually captures a part of the conversation that happens on the post. So, each one of those posts, it’s not only reading through the post that Matias did, each one of them has between 15 and 25 or 40 comments where the whole contributors come together and have an input there. And you can too. And Sarah Gooding did a great job in summarizing the main points of the support that an admin support will get from the developer community, especially the screenshot that… Well, for me it means I saw a screenshot from a plugin settings page, and you come from something like the site editor where it says plugins or the list of plugins, and then you click on it.

And then the plugin has its own space with menu on the left menu on tabs on top, and so it feels like its own app, but with the same interfaces that Gutenberg is using or the block editor is using, or by that point, when that comes out, WordPress is using. So, it all will be more polished as you said. It will be more modern, but it will also be more contained, keeping the cognitive load that you have when you have too many things that you can click on that kind of overwhelms you. You can focus on that plugin settings and that plugins app, and it will be a similar experience than the block editors now.

Sarah Norris: Yeah, that’s exactly it. I think it really helps with the user experience. It’s perfect. I’m really looking forward to it.

WPTavern

Birgit Pauli-Haack: Yeah, me too. And we had a live Q&A with the developers from Give WP; that’s a very strong plugin with millions of users that allows nonprofits to collect donations on their website. And they are coming out with a revamp of their plugin using WordPress components and scripts and making it the same interface like the block editor, but you’re creating your own forms. So they have no additional… There’s no additional training necessary to get what each interface items does. You have the dropdowns that you know from the sidebar from the block editor, you have the inserter from the block editor, and you have the design tools that you need from the block editor. And they did a great job.

And Jason Adams and John Waldstein, they did a great demo about the stage of their revamp right now. And we have a great discussion with also Lena Morita who was on the show. She is actually a developer on the components team. It was a great conversation. So, I’ll leave a link in the show notes for you if you missed it, and you shouldn’t have missed it, of course, so you can get a record… We recorded it and the post with all the additional links there in the YouTube description. So, you can follow up along that.

Sarah Norris: Around the realtime collaboration as well, Riyad posted a really good post on the core blog as well. But yeah, maybe it’d be good to look to that as well if you’re more interested in the technical detail around realtime.

Birgit Pauli-Haack: Yeah. He just posted it yesterday, I think, where he dives really into the architecture of the real time collaboration, because two years ago actually he did some experiments with a site called sblocks.com, where you could have two versions of the same post and then with different browsers, you could kind of edit it, and it was all there. And you could actually share it. I don’t know what happened with that, but so he has some great insights in how that’s going to work and we’ll leave that also in the show notes. 

Announcements

And then, this is just an announcement. If you are listening to this on the weekend and early next week, there will be another live Q&A on July 21st, and that’s with David Bowman and Alex Geatches and Joni Halabig. And we are talking about design systems and how they work with the theme.json.

So, David and Alex, they are working on the WordPress VIP side of automatic, and they have built a bridge between Figma design system, token system, and the theme.json. And so, as a site manager or designer, you can keep in sync those two systems and don’t have to recreate things in theme.json, because there’s a rich plugin that does all the settings and the variables and all that for you for your next WordPress theme. So, spinning up a new site within the design system shouldn’t be too hard. So, check it in, check in with us on July 21st, 1700 UTC. The link is on the front page of the Gutenberg Times homepage. Of course, we have it also in the show notes. And if you listen to that after July 21st, it will be on YouTube under livestreams, so you can watch the recording there as well.

Well, this was a lot of announcements, so do you have anything that you want to announce? Well, you will be a 6.4 editor co-lead, tech lead for the editor.

Sarah Norris: Yes.

Birgit Pauli-Haack: But you also work on themes, right?

Sarah Norris: Yeah.

Birgit Pauli-Haack: So, there is also a new default theme coming. Do you know anything about that? Do we have some rumors or some secrets we can share?

Sarah Norris: Yes. Well, I know it was really exciting. I think we’re going to be looking at how we handle post formats. There are ways to do it at the moment, but I don’t think they’re obvious. They’re not easy. So, I think maybe a focus of the new default theme will be to focus on post formats to help things… Podcast websites would be a good example. Yeah, that’s really exciting, because I imagine a lot of people have probably waited for that functionality as well.

Birgit Pauli-Haack: Yeah. Yeah. That has been a little bit neglected a bit.

Sarah Norris: Yes.

Birgit Pauli-Haack: … over all the Gutenberg excitement. Yes, of course. Yeah. All right, so when people want to get in contact with you, Sarah, where can they connect with you or best connect with you?

Sarah Norris: Yes, so mikachan is my username on most formats, or mikachan_ where mikachan’s already been taken. And I’m on LinkedIn and all the usual places. So yeah, you can find me easily.

Birgit Pauli-Haack: All right, so mikachan, what is that?

Sarah Norris: Oh, it’s a really old username I’ve heard since I was a kid, basically. It’s just an anime reference. I was an anime fan. I used to build fan sites using WordPress actually when I was a kid.

Birgit Pauli-Haack: So, you stopped building fan sites now?

Sarah Norris: Yeah. So yeah, it’s a little disappointing, isn’t it? Fan sites aren’t really a thing anymore. Maybe they should be. I think we should bring fan sites back.

Birgit Pauli-Haack: Yeah. Well, thank you so much. It was great fun to have you on the show, and I’m looking forward to working with you also on the 6.4 release, because we will probably connect quite a bit because Anne and I will be on the editor triage team.

Sarah Norris: Yes, exactly.

Birgit Pauli-Haack: So, we’ll give you other things to shovel through.

Sarah Norris: Yeah, I’m really looking forward to working with you too. Thank you so much for having me.

Birgit Pauli-Haack: All right, Sarah. All right. Thank you so much. Bye-bye.

Sarah Norris: Bye.

Leave a Reply

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