Skip to content

Need a way to produce menus with custom markup structure #56090

@eric-michel

Description

@eric-michel

What problem does this address?

Website menus vary wildly in structure, styling, and function. While there are definitely common standards, site developers need to have the freedom to expand or enhance those standards. Right now, the navigation block is too rigid to allow that, and creating a custom navigation block feels really onerous.

This issue is the singular blocker to us transitioning our sites to fully-block-based (which we'd very much like to do).

More thorough explanation

In classic or hybrid themes, menu creation and menu markup are separate. All of my menus are created the same way, in Appearance -> Menus, but I have a great amount of freedom in the markup via wp_nav_menu, and greater still via a custom walker.

In block themes, menus are both created and output on the frontend via the navigation block, which has very opinionated styling and function, and the markup is not easily customized. Unless I'm mistaken, the only way to really customize the output of the navigation block is via the render_block filter, which just gives you the full markup, not an array of menu items you can iterate over, for example.

That means the solution is a custom block. But replacing the navigation block seems like a pretty tall order, because I don't just have to recreate the output of the navigation block, I also have to recreate the creation of the menu itself. As far as I can tell, the menu creation tool that exists in the sidebar of the navigation block does not seem to be an easily-reusable component for a custom implementation.

Example of why this matters

We commonly create sites that have a slide-out menu similar to amazon.com's "All" menu at the top left. This requires submenu ul tags to be on the same level as the top-level menu, not nested within the li tags of their parent links. In a classic or hybrid theme, I could use a custom walker to whip this up pretty quickly without having to worry about the menu creation as well. Not so with the navigation block.

What is your proposed solution?

One of two options:

  • Significant filter options for the navigation block to customize its markup output
  • Package up the menu construction feature of the navigation block in such a way that it's easily added as a component to a custom block

Best I can tell, neither of these options exist (although it's entirely possible I'm missing them).


I'm closing #46552 in favor of this one as I feel this one is a more comprehensive summary of our issue.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions