bootstrap-5-wordpress-navbar-walker
bootstrap-5-wordpress-navbar-walker copied to clipboard
AlexWebLab
Level 2 Item not showing if it has children at level 3.
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
having same issue - it is because of the dropdown menu css class being display: none
attempting to find a fix
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.
@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.
@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.
Having same issue whereby third level isn't displaying as depicted above, is there a fix for this yet?
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
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.
I am away over the weekend, will try and start the packaging and PR process by next weekend for everyone
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.
@DrogoNevets any progress? I've also run into a use case that could use this fix.
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
@cdsaenz this seems to work on desktop, but on mobile the menu immediately closes before it can open the third level.
@cdsaenz this seems to work on desktop, but on mobile the menu immediately closes before it can open the third level.
Thanks a lot Justin! Didn't have time to check the mobile menu. More CSS required, will see to that!
@cdsaenz this seems to work on desktop, but on mobile the menu immediately closes before it can open the third level. The solution as nicely stated in https://stackoverflow.com/a/18024991/827376 where I took some of the code, works either with some javascript or via hover "expanding" (display none to block) . As Alex I don't like the hover solution that much :) But that's how I left it in the CSS gist for now.
UPDATE: I think I found the culprit :) These lines in theme.js are hiding the canvas when clicking on the next level. Without these lines you don't need the hover open, but obviously they're used for something else. Need to see why I'm getting caught by this query and avoid it.
$('.offcanvas a:not(.dropdown-toggle):not(a.remove_from_cart_button), a.dropdown-item').on('click', function() {
$('.offcanvas').offcanvas('hide');
});
Hi guys, how is this fix going? I'm not liying if I say I've been weeks looking for a fix and this is where the fix is almost found. The solutions of @DrogoNevets almost does it (except the hover issue mentioned by @AlexWebLab ). Is there any plan of publishing it?
Thnks so much
Thanks!
On dj., de set. 1, 2022 at 14:15, Manish @.***> wrote:
find the fix here https://github.com/imanishpushkar/bs5-navwalker
— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>
Just tried it. It works, at first sight, beautifully. THANKS En sábado, 3 de septiembre de 2022, 20:31:21 CEST, jordi cd @.***> escribió:
Thanks!
On dj., de set. 1, 2022 at 14:15, Manish @.***> wrote:
find the fix here https://github.com/imanishpushkar/bs5-navwalker
— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>
Sorry to bother you again. I've inspected the element and in device it doesn't load the 3rd level of the menu. I copied your exact code and the problem persisted. I do not get what's wrong traveladic.com En martes, 6 de septiembre de 2022, 11:02:42 CEST, jordi cd @.***> escribió:
Actually, I just tried it with the phone and the 3rd level is not opening. En martes, 6 de septiembre de 2022, 10:30:48 CEST, jordi cd @.***> escribió:
Just tried it. It works, at first sight, beautifully. THANKS En sábado, 3 de septiembre de 2022, 20:31:21 CEST, jordi cd @.***> escribió:
Thanks!
On dj., de set. 1, 2022 at 14:15, Manish @.***> wrote:
find the fix here https://github.com/imanishpushkar/bs5-navwalker
— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>
@jakenCD I have written steps too, follow them, clear your cache, it will work.
It worked like a charm. Thanks!
On dl., de set. 19, 2022 at 13:04, @.***> wrote:
@imanishpushkar working for me, thanks
— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.Message ID: @.***>
Sorry, it was my fault. I have the device menu inserted in a modal. That is the problem. Trying to solve it. En martes, 6 de septiembre de 2022, 11:16:34 CEST, jordi cd @.***> escribió:
Sorry to bother you again. I've inspected the element and in device it doesn't load the 3rd level of the menu. I copied your exact code and the problem persisted. I do not get what's wrong traveladic.com En martes, 6 de septiembre de 2022, 11:02:42 CEST, jordi cd @.***> escribió:
Actually, I just tried it with the phone and the 3rd level is not opening. En martes, 6 de septiembre de 2022, 10:30:48 CEST, jordi cd @.***> escribió:
Just tried it. It works, at first sight, beautifully. THANKS En sábado, 3 de septiembre de 2022, 20:31:21 CEST, jordi cd @.***> escribió:
Thanks!
On dj., de set. 1, 2022 at 14:15, Manish @.***> wrote:
find the fix here https://github.com/imanishpushkar/bs5-navwalker
— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>
Actually, I just tried it with the phone and the 3rd level is not opening. En martes, 6 de septiembre de 2022, 10:30:48 CEST, jordi cd @.***> escribió:
Just tried it. It works, at first sight, beautifully. THANKS En sábado, 3 de septiembre de 2022, 20:31:21 CEST, jordi cd @.***> escribió:
Thanks!
On dj., de set. 1, 2022 at 14:15, Manish @.***> wrote:
find the fix here https://github.com/imanishpushkar/bs5-navwalker
— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>
