What is covered in What’s New In WordPress 5.9 List View Tool
In this post, we will look at the new and greatly improved List View tool in the block editor and go over how you can use it.
And what I’m going to show you in this demonstration works for 5.9 versions that do and do not have a block-based theme activated.
Here is a video version (pretty much) of this post:
Tame those complex block structures with ease now
The new WordPress 5.9 List View tool helps you see your entire content structure, including all nested blocks, and edit them with a few clicks of the mouse. You can select exactly what you need and quickly work with and edit all those blocks all at once. This new List View tool is beneficial when trying to navigate your complex block structures.
The power of the List View tool – Let’s see it in action.
So let’s go ahead and open up a post or page and check out our List View tool.
To open the List View tool, just click on the icon in the top toolbar, as we covered in a previous post. I suggest leaving it open as you are working in your editor, but if you want to collapse it, just click on the List View icon again, and it closes things up.
Expand and collapse your block structures for faster editing.
So with the List View open, you see all your blocks in kind of an expanded mode. These are your nested blocks like those found in your group, row, and section blocks, depending on whether you use Gutenberg, Kadence, or some other page builder with container-type blocks.
You have the little arrow icon to the left of your container-style blocks that have blocks nested inside them. You can click on these arrows to collapse (2) or expand (1) them so you can see or hide them within your editor window.
Non-container blocks like the paragraph block will not have these arrow icons, but you probably already figured that out.
Moving blocks within your editor just got more simple.
With your container blocks collapsed, you can drag and drop them wherever you want within your List View tool, and they will instantly be moved in your editor window. You can still use the drag/handle tool (1) or the move arrows (2) found on the blocks inline toolbar, but why mess with that when you can use the List View tool and do it quicker.
With your container blocks expanded, you can move those individual blocks within your List View tool just as smoothly as with the entire container blocks.
The drag and drop feature within the List View tool is close to if not the favorite feature of mine with the WordPress version 5.9 update.
Bravo WordPress – Bravo!
The HTML Anchors on the List View is a multi-purpose tool.
Along with all the other cool things this new List View tool can do, it now allows you to add HTML Anchors to the different blocks.
As a reminder, HTML Anchors are a neat feature that lets your site visitor navigate from one part of your post or page to another part by simply clicking on a link you added to some text or an image.
The other purpose of adding that HTML Anchor text to your block is to name your blocks, and you can see them all at a glance within your List View. A great organization tool.
To add the HTML Anchor aka name that block, you select that block (2) within the List View (1), then with the Block Settings section open in the right sidebar (click that gear icon (3) in the top right corner to open the block settings section), scroll down until you see the box titled Advanced (4). Once you click on that, you will see the box to enter your HTML Anchor name (5).
As you type in that name, it will also display inside that block in your List View. It is a good idea to keep your HTML anchor names short, lowercase, and have no spaces if you want to use them as naming your blocks.
Even when you have a three or four-thousand-word post, you will quickly see the block structure within your List View tool with all those HTML Anchor names.
So to wrap up our tour of the new and greatly improved List View tool..,
-you can quickly see all your blocks be they nested or individual,
-you can move them with ease using a simple drag and drop,
-you can name your blocks using the HTML anchor feature, which also allows for quick navigation within your post or page.