List View: Explore Naming Blocks

[richtabor]

What problem does this address?

The list view is out of context from the block content area, making it very difficult to actually tell what each list item represents among a sea of blocks, unless its interacted with and the user identifies the corresponding block on the right.

While we do support having anchors within the List view, why don't we instead allow naming of these list items, essentially treating them like layers in Figma/Photoshop/Sketch/etc.

What is your proposed solution?

A simple interaction where one can double-click to rename a block within the list view. This would provide instant context to what that block/group consists of.

[karmatosed]

I really like this idea and I would add one more request to add also other functionality like deleting to the list view. I find myself often wanting to remove a block using this interface and having a true layer interaction space would be very useful in the editor.

[deborah86]

I like the new list view. I find myself intuitively wanting to go in and change the name of the groups, rearrange blocks, and name the groups. Having the ability to do this would make it more useful. I was about to request this feature and I see that someone already put in the work and included a beautiful graphic.

[CHEWX]

Great idea!

[dgwyer]

This would be great for productivity and page management.

[tomfinitely]

Providing the ability to name blocks seems like a forgone UX conclusion: it would be next-level helpful, especially for creating bespoke tutorials for clients. I'm VERY excited to see this added to the list view.

[JiveDig]

I very much support this. It seems like, if this is added, the same field/label should also be available in the block sidebar (outside of list view) so you can name (let’s call it “label”) them while writing/editing/creating content.

[critterverse]

Nice!

It seems like, if this is added, the same field/label should also be available in the block sidebar

^ Sharing a previous sketch that could potentially compliment this proposal 😀

113611590-bb445380-961c-11eb-92fe-5d699f679a6c.mov

[carolinan]

Maybe it should still show the block type? "Features area (Group)"

[dgwyer]

Maybe it should still show the block type? "Features area (Group)"

Or show block type when hovered over? It might add a lot of visual 'noise' displaying a custom label and the block type together?

[dgwyer]

Should a custom block label be a different color to the default block type label to indicate it has been changed? Or be italicized etc?

[heyjoecampbell]

#GreatIdea 👍🏽

[talldan]

This was previously proposed for group blocks - #16296, and there are some comments on that issue. It could be worth going back and closing that one as a duplicate if this issue gets more traction.

For some background, there have been some alternative ideas that have been explored along similar lines:

• Being able to edit parts of a block directly in List View, though I don't think is going to progress any further (Navigation menu block: allow editing of new menu items from the block inspector UI #20748, Allow editing of new menu items from the block inspector #22210)
• The navigation link and template part blocks display their 'labels' in List View and more block types could do this (Try setting a block display name for the Block Navigator. #17519)

Technically the name would probably have to be stored as an attribute on a block. I don't want to come across as being negative about the idea, but thinking realistically, that constraint might make it difficult to add this for all block types, but naming a group block could work. Some other blocks also already have names/titles, like the reusable block, and my understanding is the navigation block will also get a label in the future.

A simple interaction where one can double-click to rename a block within the list view.

This needs some thoughts around accessibility, and how keyboard interaction would work. There's been a lot of push back around introducing more controls in list view in the past (this is the article that's always cited - https://adrianroselli.com/2020/07/aria-grid-as-an-anti-pattern.html), which is why other functionality like block movers and settings are not exposed. As a first iteration, naming only in the inspector might be worth exploring. With the persistent list view it's easy to have the inspector open side-by-side with list view.