The "Side Navigation" block has an option to "Expand all menu links". The expectation is that upon selecting this checkbox, any sub-menu items will become visible in the side navigation. The actual behaviour is that only 1st-level menu items remain visible, even if navigating to the pages of levels 2, 3 or deeper, only the level 1 menu link remains visible.
The only way to solve this issue currently is to manually navigate to the Primary navigation menu and edit every menu link, selecting the "Show as expanded" checkbox.
This is how Side Navigation block is configured at the time of issue observation:
Below is the screenshot of a page, attached as Level 3 menu link, which outlines the problem.
Install the vanilla Drupal site and follow the steps to activate the CivicTheme.
Create 3 or more pages and add them to the Primary Navigation menu via the node form. Ensure they are chained together as child/parent. Example menu structure:
- Level 1 page
-- Level 2 page
--- Level 3 page
---- Level 4 page
Navigate to the frontend and only the Level 1 page menu link is visible. Navigate to all of the pages one by one to see that only the Level 1 page link is showing in the Side Navigation block.
Upon saving of block configuration, all current and future menu items become expanded and visible in the side navigation. Upon deselecting of that same checkbox, the behaviour reverses.
TBD
TBD, but none expected.
None expected.
None expected.
| Comment | File | Size | Author |
|---|---|---|---|
| #14 | FE menu.png | 160.44 KB | sonam.chaturvedi |
| #14 | BE menu.png | 554.24 KB | sonam.chaturvedi |
| #11 | expanded uncheck.png | 2.08 MB | sonam.chaturvedi |
| #11 | expanded check.png | 2.07 MB | sonam.chaturvedi |
| #2 | Screenshot 2024-02-14 at 9.34.12 am.png | 310.49 KB | ivrh |
Comments
Comment #2
ivrh commentedComment #3
ivrh commentedComment #4
alex.skrypnykThe "Side navigation" UIKit component is currently powered by the "Primary menu" Drupal menu. This menu also powers the "Primary navigation" UIKit component (in the Header component).
The "Show as expanded" checkbox on each menu item should be respected in the "Primary menu" in cases where sub-trees should not be visible.
This issue is about whether this checkbox should be respected or ignored completely in the "Side navigation" component, because, bey definition, the side navigation is expected to allow to drill-down to the menu item that points to the current page (if the page is in the menu, of course).
The solution here is to keep respecting individual values of "Show as expanded", but override them all if "Expand all menu links" item is provided in the block.
For this to work, we need to get the value of the "Expand all menu links" on the menu block and pass it to the Drupal's preprocessing of the menu items to mark them all as expanded.
Comment #5
fionamorrison23 commentedComment #6
fionamorrison23 commentedComment #7
fionamorrison23 commentedComment #8
fionamorrison23 commentedComment #10
alex.skrypnykComment #11
sonam.chaturvedi commentedVerified and tested on 1.x-dev
Testing Results:
1. Upon selecting 'Expand all menu links' checkbox in the "Side Navigation" block, all sub-menu items are visible in the side navigation - PASS
2. Upon unselecting 'Expand all menu links' checkbox in the "Side Navigation" block, individual values of "Show as expanded" is respected - PASS
Screenshots:
Selecting 'Expand all menu links' checkbox
Unselecting 'Expand all menu links' checkbox
Comment #13
alex.skrypnykWe have identified that we also need to apply the same behaviour to the Mobile navigation.
Comment #14
sonam.chaturvedi commentedVerified and tested on 1.x-dev
Testing Results:
1. When ‘Show as expanded’ is unchecked for L1 / L2 menus, the child menu items are not displayed on mobile. - PASS
2. Works fine on desktop - PASS
Screenshots:
‘Show as expanded’ is unchecked
The child menu items are not displayed
Comment #15
alex.skrypnykImplemented, tested, merged and will be released in 1.7.