Quick Video Tour of Wagtail 4.0 inc Blocks, StreamField & Rich Text

Hello and welcome to our quick video tour of Wagtail 4. 0. You'll notice straight away that we have an updated sign-in page for this release. And there's also been some updates to the accessibility features that should make this page easier for everyone to use. Now, when we log in, you'll notice there are not a ton of changes to that have been made to the dashboard. But you'll definitely start to notice some changes as we drill down a bit deeper into the page structure. There have been some breadcrumbs added up here at the top that make it easier for you to figure out where you are in the page structure. And we've also added some additional actions to this action menu here to give you some more options

for manipulating your pages. Now let's go a little deeper here. We'll go into the homepage for this demo, which is the Welcome to Wagtail Bakery page. And you'll notice some things are the same and some things are different. The content, promote, and settings tab are still the same Still have the breadcrumbs in the action menu, as well as the status panel and the ability to toggle comments on and off. But one thing that we're super excited about in Wagtail 4. 0 is the addition of this preview panel right here. With this preview panel, you can go ahead and see your page in different layouts according to different devices. Don't have to open developer tools to do it. It's just all right here. So we have the mobile version here.

You can click and see the tablet version and then you can click and see the full page version all without leaving the content editing page. And the best part is that you can make changes that are live and the preview will update automatically as you're making your changes so you can see in real time What changes are happening as you're making them. And if you still like to have a full page preview, that feature hasn't gone away. You just have to click this button here. and it'll open up a full page tab right there. So super excited about that preview feature Now let's have a closer look at the page options themselves.

One thing you'll notice straight away is the addition of these chevrons here. Which make it easier to open and close page sections. So instead of having to scroll through everything on a really long page, now you can collapse everything and then open up the section that you want. So saves you a lot of time when you're working with really long pages and some real chunky content. So let's have a closer look at the stream field here. Stream field is where all the action happens in content creation. You'll notice that we moved the plus button from the middle of the block to the left side, and we also made a change to the menu here so that now it gets toggled on and off.

This is where you can move blocks up and down, duplicate blocks, and delete blocks. So let's go ahead and start adding some new content You'll notice when I hit enter that this plus button shows up on the left-hand side here. And we can click that and open this menu and it gives us a wide range of options. You can search for the block you want. Say we wanted to add a new paragraph block right there. We can go ahead and do that. Or you can just pick from this whole list of options. you have right here to add a new block straight to the page. So let's go ahead and look at some of the features that have been added to our paragraph block, which is where most of the rich text

features show up so something like I really love pumper nickel bread We'll add that sentence there. In the past, there has been a steady menu where you can pick different formatting options, but we changed that a bit to make it a bit more ephemeral. Now it pops up when you highlight and so you can add bold or italics depending on your needs. And as soon as you're done with it, you just click back in and that menu stows itself away In addition to that, if you're a writer like me and you just love to just write, write, write, we also added these slash commands here

that allow you to keep your hands on the keyboard. So like I can check. change a heading and add something like bread is awesome right here and then I can hit enter again and then I can uh pick another feature like I can do a different heading. It is Very tasty right there, uh, all without having to take my fingers off the keyboard, which is super great for when you get into a flow. We also made it easier to add links. So say I wanted to add the link to the Wikipedia page on bread. I can go ahead and copy that link and then paste it straight in, and it's automatically formatted, and I can just click the buttons here

to go ahead and update the text uh without having to make any additional clicks or changes on that end. So those are some of the features that have been added to Streamfield. As usual, the save controls are in the same place at the bottom of the page. Definitely want to hit that save button. It's your best friend. And uh before I sign off, I just want to comment on a few things that are available, like you know, behind the scenes here. Uh we made a real big effort in this release to make sure that our labels for different form fields and help texts were all inconsistent We're hoping that it'll make Wagtail a better experience for anybody who navigates with keyboards or screen readers.

We've also added more support for Windows high contrast mode, and we've also added some great new features to make customizing choosers easier. And multi-site users will rejoice because we've made some of the settings for multi-sites a lot easier as well. So if you want the full nitty-gritty details, definitely head over to docs. wagtail. org. and read the Wagtail 4. 0 release notes. As you can see, one other great thing in this release is that we've added a dark mode for the documentation. Darkmoke fans, rejoice. You now have dark mode for our documentation. And if you are not really interested in the details of the full release, definitely head over to Wagtail.

org. slash try dash wagtail and give Wagtail a shot on your own. Definitely kick it around a bit. Tell us how we did. We'd love to you to give it a go and let us know what you think.