Level 2 Item not showing if it has children at level 3.

[asifpix]

Hello Alex,
Hope you are doing well. I have encountered an issue today.

If you have any 3rd level menu item then it's immediate parent item will not show. To get understand the issue I have attached 2 screenshots. On 2nd screenshot of front-end you can see that, the "Level 2" menu item is not showing because of it has children. "Level 2a" and "Level 2b" are showing properly because of they don't have any children items.

I have fixed the issue already on my side.

Best Regards
Asif

[DrogoNevets]

having same issue - it is because of the dropdown menu css class being display: none

attempting to find a fix

[Kemal-Sulic]

I'll take a closer look in the near future, but if you're still having issues, there's a small hotfix for customers/admins to not mess up the menu by hooking into nav-menus.php.

[AlexWebLab]

@asifpix
Feel free to create a pull request with the fix. I will not fix this because it's not a bug for the scope of the project since Bootstrap 5 doesn't support 3 levels menu.

[DrogoNevets]

@AlexWebLab I can create a fix, however needs JS and CSS is this ok?

[AlexWebLab]

@AlexWebLab I can create a fix, however needs JS and CSS is this ok?

Yeah you can share. Maybe I'll make a branch for that.

[beshealthcare]

Having same issue whereby third level isn't displaying as depicted above, is there a fix for this yet?

[DrogoNevets]

I am still working on this amongst my day job.
It is probably good enough tbh - but want to have a little play around more

I am using it here if you are happy with that I can create a fork and PR and see what @AlexWebLab thinks, but need to think about the package for it a little too

[beshealthcare]

Hi @DrogoNevets - Your version seems to achieve the desired effect, so I would be more than happy to use that over what I have. The only thing i'd change for my personal requirement is to have the menu's open on mouseover rather than click on desktop, with open on click for mobile.

I still can't understand why Bootstrap and Wordpress can't work together to fix this issue.

[DrogoNevets]

I am away over the weekend, will try and start the packaging and PR process by next weekend for everyone

[AlexWebLab]

I am still working on this amongst my day job. It is probably good enough tbh - but want to have a little play around more

I am using it here if you are happy with that I can create a fork and PR and see what @AlexWebLab thinks, but need to think about the package for it a little too

I'm totally okay but NOT with open on hover.

[justinb40]

@DrogoNevets any progress? I've also run into a use case that could use this fix.

[asifpix]

Hello @AlexWebLab

I have created a pull request with the fix.

[cdsaenz]

To avoid breaking anything in the current implementation (following Bootstrap design) , after a big effort I came up with a solution , by basically taking Alex's code and overriding display_element and removing the $depth check (could be added back with a different parameter). Also added some css classes here and there. It's all in the GIST link below (in the code, a link to the CSS too). Just finished, could be rough, so test it out, but here it works fine! UPDATE: it was mostly CSS. Call with $depth 3 or more!
https://gist.github.com/cdsaenz/d6d65294d79a0b71b95c55a4bbd47f7d

[justinb40]

@cdsaenz this seems to work on desktop, but on mobile the menu immediately closes before it can open the third level.