“Extending” Wordpress to offer bootstrap 5, vertical, accordion menu that is parent/child aware to depth 2

Wordpress comes with wp_get_nav_menu_items function that suffers from two major limitations:

1. It is limited to depth 1 in determining the parent/child relationship
2. It does not -directly- provide the information if a submenu item is a parent to another (sub) menu item

To overcome this shortcoming, the WP community has created various menu “walkers” that allow their adopters to extend and/or override the default WP menu behaviour.

However, these attempts suffer from the inherent shortcoming of the WP menu that is not fully Bootstrap 5 compatible. For example they rely on the <ul><li></li></ul>

The menu that I wanted to simulate

HTML directive to display the menus, and their over-riding with <div>s is… too little too late, as bootstrap5 also relies in <span> directives, whereas the presentation/highlighting of the actual location of the user in the menu, it happens nowadays with JavaScript (vanilla & JQuery).

I spent a couple of frustrating days in trying to re-create the functionality of the Metronic vertical…