Navigation Overview: Phase 2 priorities

[mtias]

This issue captures the current priorities for Navigation which we are aiming to include in WordPress 6.2.

Some progress has been made in 6.1, particularly on the theme switching, fallback and new menu facets. Editing menus is now an area that now requires attention.

There's also a longer backlog used to more exhaustively track open issues, bugs, and pending tasks at #38275.

Editing Menus

There are other questions around how to normalize things like "page list" (automated list) and individually curated items, how we handle transitioning from one to the other mechanism, etc. The flows for managing a menu extend beyond the menu itself (as in, it also needs to be taken into account when creating content like pages) and that's important to recognize.

• Navigation List View: Introduce navigation editable tree view in the inspector controls #42257 ⚠️

This work for 42257 can be broken down into discrete pieces, some of which can be done in parallel. These in a rough priority order:

• Create list view in the block inspector as an experiment (Off canvas menu editing: adds list view to navigation block #44534)
• Navigation List View: Conditionally enabled/disable block selection in the canvas #45440
• Navigation List View: Add an "edit" option #45442
• Navigation List View: Create a drill down navigation panels system #45439
• Navigation List View: Add a “create submenu” option #45441
• Navigation List View: Add a block appender #45445
• Page List: Display items in the List View #45482
• [Navigation Block] Experiment: Change focus when we edit a menu item to the correct tab #45951

---

At this point we can do some user tests

---

• Navigation List View: Move the navigation selector to the dot menu #45444
• Navigation List View: Handle the wide sidebar #45446
• Navigation List View: Move the list view to a separate tab #45447
• Navigation List View: Drag and drop considerations #45448
• Improve empty menu state in Nav Offcanvas #46202
• Page List allows insertion of any child block #46224
• Use LinkControl in Navigation Link block controls #46217
• Utilise LinkUI component in Navigation Submenu #46207
• Nav Submenu block Link UI text control #46206
• Handle non-direct insertion in Nav offcanvas inserter #46203
• Navigation Link: Handle rich text better in the label #46055
• Use <Navigator> component on Inspector Controls "back" button UX #45884
• Navigation: Share layout code for both Page List Item and Navigation Link #46050
• Universal block inspector controls back button #46058
• Navigation: Don't use the "submenu" icon for the navigation submenu block when in the list view #46065
• Navigation: Move the "add submenu" item and add an icon #46072
• Page List: Lock icon in the inspector controls #46191
• Explore a more systematic approach to interactions that should / could hide the block toolbar #46192
• Nav off-canvas editor not offering the option to create a new page when it doesn't exist #46193
• Navigation Items: Add transform items in the inspector, a la Group/Row/Stack #46195

---

Nice to haves:

---

• Page List: Add parent parameter to show all child pages of current page #31063
• Navigation Focus Mode: Ability to access/edit Navigation Post items in isolation #37950 (see Add focus mode for Navigation Menus #39286) - it should be possible to link from wp-admin to editing navigation in template focused mode
• Navigation: Improve the experience for moving between "auto" and custom items #45450

[mrkdevelopment]

@mtias Is there a possibility of conditional headers being added to the roadmap?

Scenario: I have 10 header designs. 1 is a default, the other 9 are conditionally loaded on pages where I sent the condition.

I have a couple of simple examples to explain my thinking.

1. Landing Page

I have a landing page and want a different header for this landing page compared to the main site. How would this work with the new navigation / header tools? I want a specific header with custom navigation for these specific pages.

2. Logged in User

I want a conditional header for a logged in user that displays a specific header only when a user is logged in. Is this something that is possible? (I'm not talking about a login or logout block, but the whole header being changed)

3. Custom Header for Blog categories

I want to have a different header on different blog categories. I have 9 categories and can potentially design multiple headers to allocate conditionally.

Are these kinds of features within core or are we looking at these being the realm of third party plugins?

I read over the other tickets but these seemed to be limited to just login / logout and conditional navigation. Not the whole header section or other sections having multiple variations and conditionally being added to pages.

I'm not sure if this is the right place to comment so feel free to move this where it should be.

[mtias]

@mrkdevelopment sorry I missed the questions!

1. Unless I'm missing something, you'd just use a different header template for your landing page with whatever navigation items you need.
2. Not possible from the editor UI alone. Can you share how the menus would differ and what would they have in common (if anything) to clarify the need further? Would be good to open a new issue with this request specifically if you don't mind.
3. This should also be possible with category templates, which can be as specific or broad as you need them to be.

[scruffian]

I updated this issue with the latest priorities for phase 2.

[getdave]

Update 17th November 2022

I posted an update on the Tracking Issue to alert folks that progress for 6.2 will be tracked on this Issue. Read that update for details on progress.

Future updates on 6.2 progress will appear here.

[scruffian]

Update 1st December 2022

There has been good progress on the items in the issue description. We now have the basics of the Navigation List View working. It is possible to view, edit and remove navigation items from the inspector controls. Drag and drop also works. The main areas of concern are:

1. When editing an item, can we show the settings tab?
2. Can we animate the opening of the block settings to make it clear that this is conceptually a "drill-down" operation

These will be the next areas to focus on. Work is happening on this project board: https://github.com/orgs/WordPress/projects/60/views/1, which should give more detail on progress.

This video shows the current state of the project:
https://user-images.githubusercontent.com/275961/205058431-36250e48-bff3-42a7-a673-997a47d841d5.mov

The issue description will be updated to reflect the current outstanding issues.