We hear this all the time. There are so many updates and tons of community work happening. It's hard to keep up. How do I follow it all?
Here is your answer. Listen to the Gutenberg Change Log. Hello and welcome, everyone, to our 24th episode of the Gutenberg Change Log. In today's episode, we'll talk about the earlier release of Gutenberg 8.5, approaching the release of WordPress 5.5, the JavaScript for WordPress conference, and the blog directory, and many, many more things.
I'm Yerti Polly Hart, curator of the Gutenberg Times, and I'm here with my co-host, Marky Wayne, designer at Automatic and core contributor to WordPress. So this has been a crazy, busy week for me, and I learned a ton about plugin development and scaffolding modern JavaScript. That's a win in my book. So how have you been, Mark?
I've been well. It has been a busy week. I will agree with you there. I'm excited about the new WordPress release that's coming out very shortly here, which we'll get to in a bit.
And yeah, like, I really agree. Just been busy. A lot of stuff, a lot of information flowing through right now. Yeah, I've been a lot of reading.
So as an announcement, the JavaScript for WordPress conference has come and gone. And after 16 awesome talks on Gutenberg, WordPress, and Headless CMS, and you can catch the recordings on broadcast until they're available on Zach Gordon's website, JavaScript4wp.com. The Gutenberg block building talks were great. I was only able to listen for a short period of time before I had to get back to work, but I want to give a shout out to the speakers and to put them in your memory so you can come back and watch the videos.
Chandrika Gunthor talked about converting short notes to Gutenberg blocks. It has many of us are looking forward to it. Justin, sorry, I'm buttering his last name. Sorry, Justin.
He showed how to take advantage of the Gutenberg reusable blocks. Donnie Alavi talked about the data visualization with Gutenberg. What? Whoa.
I missed these talks, so I cannot wait to watch some of these. Yeah. Mario Santos had a case study connecting Gutenberg in front of the framework, and then Kim Laferda wants you to turn and face the strange and talk about making the transition to Gutenberg, and Diane Wallace talked about building custom components for Gutenberg, and I just caught a few minutes of hers as well, and that was really excellent. Kim Laferda, that's pretty clever.
Face the strange, I like that one. Yeah. So my talk was on Thursday, and it was an exploration of the great create block scaffolding tool that's built into Gutenberg plugin and how it relates to getting single block plugins into the block directory that will be available with WordPress 5.5, and I'll share this right back in the show notes if you're interested. I just want to say that talk is very timely right now.
So with 5.5 coming out, and I think you and I talked earlier about how there's really not a lot of documentation on this, so if you're interested in getting your plugins into the single block plugin directory, watch Weirdest Hot there with some of that, how to do that. Although it's all a work in progress, you're right, the documentation as well as the block plugin validator that Alexius is working on is also a work in progress, but you can already check it out, and I have some links in the slide deck, and I will add them also to the show notes here, so you can get yourself acquainted with it. So shout forward to Zach Gordon, who put a fantastic conference together. This were only six of 16 talks.
He did a fantastic job also to make the speaker roster diverse and inclusive, and it takes a lot of work, so I'm glad he took the time and the effort to make that work so well. And he had some great emcees, Mary Jal from the community team and from Uganda. And then Fabian Kegi, who is a friend of Gutenberg-Kind, he was also an emcee on the conference. So great team, well done, and I'm looking forward to the fourth annual JavaScript for WordPress conference in 2021.
Speaking of the block directory, we are working on a live Q&A, and it will take place on August 6th at 7 p.m. Eastern, 23 UTC, which is a little bit late for our European friends, but we need to kind of do an odd thing because Alexius is going to come, and he's in Australia. Alexius and Kelly Dawn both work on the block directory feverishly to get it into beta release, so they only have to fix the bugs later, but the 2 5.5 feature freeze was on July 7th, so a lot of things needed to be done by then, that's why documentation and other things are a little bit for the way you said it right now. You can subscribe to our YouTube channel, youtube.com, forward slash moving.times, at any time, and you will notify as soon as we go live with our next show.
So that's what's from the announcements. Yeah, I'm so glad that you do those Q&As because that is just such a valuable time of information that is conveyed to the rest of WordPress users, and it's like, if you're interested in that stuff, right, like, this is a perfect opportunity to really just listen in to hear what these people who are building the product are doing. Well, thank you for that. Yeah, well, thank you for mentioning that.
A lot of fun. And to our listeners, if you have an idea of what you should do on those live Q&As, and have an idea you should come on, I'm open for suggestions and ideas, yeah. So we have community contributions now. First one that we noted was Munir Kamal published his Editor Plus plugin, and that basically extends to four blocks with a ton of additional settings and options.
He calls it the no-code visual style editor. It includes things like background for individual columns, box shadow, margin, and padding. On the Goomba team, we're always hearing the desire for these other features to be baked in, and here's a plugin that's really addressing those needs of the users out there. So, Munir, this is great work.
Yeah, can you say gradients one more time? Background for the individual columns actually also includes images, not only color, or gradients, but also images. Really cool. I find many, many settings on the block sidebar quite anxiety-inducing, and I know I will spend a lot of time just checking them out.
So I have mixed feelings about all these options that I'm more bothered with, because I feel maybe if I'm not looking at them, I'm missing out on cool stuff, but the border radius on columns is really cool. It really is, yeah. I totally agree with you there. And as if that wasn't enough, we're looking at ways right now, and Goomba itself really advances the actual block toolbar, and ways to fit things in there more.
And there's a lot of neat experimentation going on. That's great. I'm looking forward to seeing this, yeah. So another plugin that came about is in its update is the Weston Rodgers syntax highlighting code block.
And he writes, this plugin extends the code block in WordPress core and syntax highlighting, which is rendered actually from the server. So pre-existing code blocks on the site are automatically extended to include syntax highlighting, and doing server-side syntax highlighting eliminates the need for enduing any JavaScript on the front end, like Highlight.js or Prisma.js. This makes it not only quite fast, but also AMP safe. And just in case you don't know, Weston Rodgers works for Google on the AMP plugin for WordPress, so he would know.
You kind of expert there. Yeah, kind of, yeah. The plugin update includes line highlighting, so you can determine which lines are actually highlighted in the cloud. And you have a choice of programming languages, and you can show line numbers or red lines and all through the block settings are quite extensive.
So if you have a developer blog where you share your learnings, you get some nice tools with that. That's very valuable, yeah. I know sharing code on blogs and articles I've written, it's just so nice when it's like syntax highlighted numbers, like it just mean it is enjoyable. Yeah, it feels like your own code in your editor and IDE, yeah.
And I must say, a lot of documentation that we have on the GitHub or in the tutorials is lacking a few code examples, yeah, that kind of gets you started and to think about that and then the explanations later on. So I think I'm going to team up with Mark, who has been working diligently on getting tutorials ready. He also worked on the create block documentation that comes, will come into the tutorial soon, yeah. So I think that documentation got in, right?
Yeah, you won't have it in your list there. Yeah. Speaking of running, what was released? WordPress 5.5 beta 1 is out.
It was released on January 7th. Please go out and test it. There is a beta test going out there that you can download that through a test site, but take your live site into a staging environment. Yeah, so test it on your live site soon.
Yeah. The release candidate, you might be able to test on the live site, but it's also a big release, and it touches all corners of WordPress. So make sure you are not getting live-sided by any of those updates. And of course, no one wants to break anything, but it's known to happen.
And the more people, what is I saying? The more people in there, all the bugs are shallow. So that's my shallow for WordPress 5.5. And that then takes us to Gutenberg 8.5 and 8.5.1 that have been released.
There are about 140 change items in this release. Amazing. Right? Yeah.
I didn't think they would do that many in this one, because I figured this was just like, let's get the last few things in, ready for 5.5. But here we are. This is a very impressive change that happened. So I'll choose on this plugin.
We'll make it into WordPress 5.5, except for the experimental parts, of course, like full site editing, navigation screens, and blocks, and widgets, right? That's not going to be included in 5.5, but there's so many other things that are coming in with block editor for 5.5 that. It's kind of a relief not to have all this stuff pushed in one release before. But there were two major features in 8.5.
One was for accessibility, add an option to keep the carrot inside blocks in the edit mode. And number two was adding an anchor or ID support to all static blocks. And that sounds kind of technical, but it's a big deal. There's been a lot of requests for this.
Now you can add links to parts of a post, no matter which form it took. It can be a paragraph or an image or a quote or anything really. This opens up the content for additional functionality, like a native table of contents or a citation down to a paragraph that was cited. At the moment, it only works with the static blocks, which are built in front-end rendering.
So it's in the works for dynamic blocks. So keep an eye out for dynamic blocks, but it's there. A lot of people are digging that. I read the issue when it was kind of introduced to that.
And a lot of people were trying to add those anchor links into the HTML and then the block parser kind of taken out again. And there was a never-ending cycle of kind of while they had to use a custom HTML block because that's used HTML wouldn't work for someone. So a lot of frustrated users out there that are now getting that in. So it's really cool.
That is. In the changelog, there were 34 enhancements in this version. I'm going to come through a good number of these because they're also fun to read through. There was an edit button to the gallery images.
So you can actually edit individual gallery images. The image block allows uploading external images if the image host allows it. So if you're good, I know you love this. Explain this one.
What happens? So what happened to me was that we did on the documentation team, we had new contributors and said, well, write and Google Docs and add your screenshots to it. And then we copy paste it into the site. And what happened was that we were not able to get the images over because they're still linked into the Google documentation.
So you don't want the pictures to go mad or 404 when somebody just leads the Google Doc because they were done with it. So I think I advocated for it in all corners of people who have anything to say. And then Ella was so pretty small to say, oh, I put it into WordPress 5.5 and I will work on it. It didn't get as far as she wanted, but this is fine for me.
What it does is you copy paste something over from Google Docs and then the image comes over and then you see on the image block a little button that says download the image or get the image as well. And then it automatically goes out, gets the image and puts it in your media library. So that's fantastic. Thank you, Ella.
I know. That's what I say, right? I love it a little bit as well. And yeah, we do a lot of writing in Google Docs, so that's definitely our saver when we do publish things.
There were also a lot of drag and drop improvements. You had some enabling for multi-selection, improving the drag and scroll behavior. Pretty cool if you're dragging up towards the top or towards the bottom of the screen and it's a long document, the scroll behavior will move faster for you and slow down as you move away from the edge of the screen. That's good.
Because I never got to the point where I could scroll it up there. Don't show a cloned block while dragging. I love this because I would always get confused seeing the block then, trying to drag this, also seeing it still in place. And so it would clone the block.
You'd see the block in two different areas and it just kind of was confusing for a long time. That has been fixed. And actually when you go to drag a block now, it kind of minimizes into this little chip, this little black thing that you can kind of easily drag around the page and drop it wherever you want, which I love. There are a lot of image editing enhancements, like moving zoom control to the toolbar drop-down, adding original aspect to drop-down.
So now the toolbar for image blocks, when you click the crop tool or the edit tool, there's a lot of different editing variations or cropping variations that you could do. And all these are kind of now getting grouped together and I'm actually working on an issue right now to even refine that further. So it's really nice. I can also see that that takes a lot of work and a lot of iteration to get it right with the expectations that our users have.
And who is going to do that? Yeah. All the developers and designers who have already put in the time to make this happen, like kudos to them because it's fantastic that we have these controls now. Let's see, there's of course the block directory.
There's a few changes there, like use the CDN for block directory assets. Polishing the documents, sidebar controls. That was one that we simply got in and just really tightening up a lot of the sidebar controls. Now you're saying sometimes it can cause you a little anxiety.
Well, just by adding a little polish here, it kind of helps visually. There's adding the modern WP admin color scheme and so forth. So if anybody's watching in track, there's a new color scheme that got merged in for your WP admin called modern. And Gutenberg also now adds support for that color scheme to translate into the editor as well.
Well, that's awesome. So that's a little feature that kind of got stuck into the big, big WordPress 5.5 and only surface it here. Yeah, it's interesting. There was redesigning the transform menu.
So that basically used to be a grid of blocks when you'd open up it from the block transform pool. Now it's a list, which is a lot easier to kind of scan through and see what's going on. They redesigned the canvas inserter. So, you know, when you roll over between the blocks, you get like a little plus button.
When you click that, the inserter that pops up right there is redesigned and there's just shows like the latest blocks or most recent blocks that you use or something. And then there's a browse all button as part of that. Yes, that's all that says. Much cleaner, yes.
Yeah, yeah. There's add block variations to the slash inserter, which is kind of cool. So if you're just using the forward slash to search for your block, now you have block variations in there as well. Add reusable block tab to the inserter.
So when you click, yeah, and you get that. Now it's like a panel of the inserter, right? So you used to have blocks and patterns. Now it blocks, patterns, and reusable blocks.
So it's kind of a really good way to see a reusable blocks in spotty to add to your document. Yeah, they're all lost on the bottom of the screen. You had to scroll through all the blocks that you had from the plugins to the core to get the reusable blocks out. And then we have add keyboard shortcuts for moving blocks.
Move blocks around with keyboard shortcuts. Making preview and save draft buttons use the same style. So you'll notice as with all the other UI redesign that happened in Google, that the save draft and preview buttons now are looking. very similar so it's like just a nice little painting another one adding unlinked url to button blocks the buttons block so if you ever wanted to then you added link now you can unlink it you only could replace it yeah you could like delete the button right and then start over again the last one here under assessments that i have is clean the patterns list to include in core so what that meant is that we spent some time uh some designers and developers kind of spend some time going through the list of patterns and kind of cleaning refreshing that list of it so we can make sure that patterns that are going into core are the patterns that we want and think that people will use block patterns are the first time in core so it's going to be really interesting there with the block patterns the block directory the reusable block surface there's a lot of good new features in there for the block editor apart from the cleanup ui but also in the new um in 8.5 was new apis went in there and only five new apis and i'm highlighting three of them there was a stabilized image editing rest api endpoints so you can use those also in your own blocks and also server side if you need to and then you can and stabilize also the block directory rest api endpoint for the block directory coming into core the new apis also include adding descriptions to block patterns so you can tell people what they do with block patterns sometimes the title of the block pattern isn't really enough to tell like maybe screen reader uh what actually does right that's like the block pad block pattern tab it has a visual of how the block patterns are locked but of course if you have a visual impaired you don't see it that well it definitely helps the experience that the team has been working on is a full set editing experience a site building experience so to speak and has a few enhancements on fixes it definitely improved the template parts insertion flow which was kind of tested and where some changes made and add the template part block keyword to the box searches and so that helps as well and then there were some changes on the navigation screen and the navigation block one of them was specifically for accessibility improve keyboard navigation on the navigation block tooler that is big another one was hyper block tooler on the navigation screen that was a little clunky when you had wanted to put menus or menu items there you also get the navigate the block tooler there and it was kind of covering things up so that's really good and then allow setting up menus that auto add new pages that makes the navigation screen feature on feature power with what's possible now you can do that in the customer service and the last item here is to also allow the search block to be added alongside the links into the navigation bar a lot of sites do that but it's now relatively hard to do or impossible without some development access to the theme so this is definitely a great yeah now i think we just need to tighten up that search block a little bit so that it works nicely in the navigation block yeah yeah it depends on how much space it takes down and i think this bug fixes there were about 33 of those in this change log several of them had to do with the block directory as everybody knows that's a new feature so working out the kinks there still there's fixing the horizontal block mover layout which is a cool one fixing invisible drop target indicator so if you're dragging and dropping blocks around and you kind of need to there's a little bug there so that's so the fix was to make invisible right fix invisible yeah yeah let's see the classic block had several bug fixes which is great because that one was just kind of lingering there unattended for a while at least so these bug fixes are really helpful yeah i'm glad that somebody attended to them there still a lot of users that come over from a classic editor are still very much involved with the classic block as a replacement yeah and i think i highlight one other like don't oh don't try to move to trash action if the user is not allowed to delete posts so that kind of seems like an important one user to have permission to move to trash we had one major performance improvement of the keyboard shortcuts binding right and then speaking of performance here we had nearly a almost a 0.5 second loading time improvement from git boomer 8.4 8.5 not much of an improvement coming from 8.4 8.5 on the keypress event though but still really good love seeing the performance improve all the time yeah but i mean i look at the table that is on the bottom of the release notes if you ever want to look at it there's quite some improvement between verters 5.4 and wooden book 8.5 so i didn't do the calculations but there's definitely a 25 improvement there on the keypress event typing and we had about 12 uh documentation changes these include things like adding a documentation page explaining how the repository is organized so that one i think is super valuable for new users coming in to look at the repository there's another one about add create a block tutorial so so adding that tutorial which we kind of discussed earlier update categories in block registration documentation so the categories you know of course not revise needed update application and several other things as well including typos and tweaks of all kinds and if you were looking for a documentation on the wp block styles you will also find that in this release that they were updated or clarified um code quality issues with about 31 quality issues in there they seem to be malicious but sometimes they're really really important because the little things make actually the work around right yeah so one i wanted to point out is that they reduced the number of sas color variables for the block editor which cleans up code nicely yes and then there was a block directory it removed the custom commission check and now uses the canned user capabilities from core to make sure that only people who have permissions to actually install plugins can use the block directory because that's what it does it installs plugins in the background so you need to have that yeah there was some things that unnecessary uh removing unnecessary block directory dependency cleaning up image editor rest routes and fix and testing for the post author block that i can see there which brings us then further to tooling and that is even more thing that happened a lot in the background it's about the continuing integration setup with travis and github also about packet management and improvement in the release tool and release documentation and certain additional scripts were added like a personal plugin and exclude node models from source mapping and all this good thing good stuff and run end-to-end tests which brings us to the various section of our release notes and there were actually five items in there one is that there is a range control that integrates a number control on the block editor the create block tooling is now generating a block json file if you don't know what that is that it's actually streamlining the process or the block metadata in one file so php as well as javascript are able to access it for the register block type functions and there is no duplication anymore between those two layers the other server side rendering and the client side rendering of things and then there's basic the block context changes from core and then also sync the themes endpoint with the course endpoints that's for the full site editing experience and that's the end of our changelog run through for gutenberg 8.5 and so now we have what's in active development and we talked about wordpress y5.5 in beta 1 right now and i just want to repeat that everybody please go test this out because it's a big deal it's a big release and it touches all corners of wordpress so make sure you're prepared for what's coming i just wanted to reiterate that yeah there was a post recently uh editor features for wordpress 5.5 update by andre andre and the release team is also working on dev notes for five new features for developers and there's one on updating the default block categories another one on introducing new api method that register block from block.json metadata file there's one on introduce block context another one support filtering arguments and block type registration and finally rest api one about exposing blocks registered on the server we'll have links to those in the notes and finally there was also a uh oh that's just on what we have here is the access spreadsheet so that justin who is the wrangler of the developer notes for wordpress 5.5 has put together to see which track tickets actually need dev notes so and i only pulled we only pulled the editor ones out there but i think that's also good for developers to have in mind there are also coming a lot of changes again to gutenberg for those who listen who don't know what block context is that is introduced is the idea that if it's a child block in a different block will behave differently than if it's on standalone and so the parent block can pass on props to the child block as well as styling and other options so that's certainly something that developers are going to use yeah all right so we are at the end of the show yay yay yeah thank you mark and thank you to the big gutenberg team that has yet uh released another awesome gutenberg version at the end of the show i just wanted to remind everyone august 6 7 p.m eastern 23 utc is the gutenberg times live q a about the block directory with the team as a shields and katydon from the meta team working on that block directory so well do you have any last reminders or announcements or i do not right now you're good so yeah i just thank you for joining me within this episode and to our listeners for listening in but uh yeah it's time to close this out all right well uh listeners you might have noticed we didn't have a review to read this is your chance for our next episode to send us a review or post a review to itunes and it will help to surface this awesome podcast higher into the suggestion box on itunes and other blog podcast apps as always the show notes will be published on gutenbergtimes.com forward slash podcast this is episode 24 and if you have questions or suggestions or news you want us to include send them to changelog at gutenbergtimes.com that's via email to changelog at gutenbergtimes.com or just email on twitter in a dm it's always open so thanks for listening goodbye and until the next time thank you mark thank you bye everybody you