Problem/Motivation
When adding a Menu Item, it is possible to add special items like <nolink> or <button>
According to Menu Link form:
Enter <nolink> to display link text only. Enter <button> to display keyboard-accessible link text only.
Current navigation twig template structure does not respect these items and render them as links whose href is empty, having a different behavior than the expected one.
Attaching screenshots of the same menu as part of navigation or as a block to show the differences:
![]()
![]()
Steps to reproduce
- Install a Drupal site and enable navigation
- Edit any of the menus included in the navigation bar
- Add menu links whose Link field value is <nolink> or <button>
- Confirm that those items are shown as empty links instead of the expected HTML markup
Proposed resolution
Update navigation twig templates to respect the special menu items behavior.
Checked how menu.html.twig
works and it seems this piece of code generates the expected markup:
{{
link(
item.title,
item.url,
item.attributes.removeClass(item_classes).addClass(link_classes)
)
}}
Could be worth to explore how it works and try to reuse or replicate its behavior.
Remaining tasks
User interface changes
API changes
Data model changes
Release notes snippet