Let’s say I still want to be able to manage my menus in Appearance > Menus.
The docs say I can nest the ‘old’ Nav Menu element into ‘Dropdown > Content’.
And in the source code this works perfectly - a new <ul> is nested inside the Dropdown <li>, nice and clean. Seems like Bricks strips the Nav Menu’s usual <nav> and <div> wrappers.
However, this doesn’t seem to work at the top level.
If I nest a Nav Menu element inside ‘Nav (Nestable) > Nav Items’ (i.e. at the top level), the source code isn’t nice and clean, like with the Dropdown. The <nav> and <div> wrapper elements are still there.
I’m wondering if it’s possible to use the Nav Menu element at the top level of the new Nav (Nestable), with the same clean nested list as you get when you drop it into a Dropdown element?
Just to understand, can you tell me more about the exact use case? So why you don’t use the “regular” nav menu element in this case? Is it about inserting other elements before or after the elements from the WordPress menu? Or what are the advantages from your point of view to use the Nav Nestable element in this case?
It’s because I’d like the ultimate flexibility the new nav nestable element brings. I can have a mega menu, I can insert other elements like a search form or CTA button really easily, etc.
But… it’s also really convenient for me and/or clients to be able to manage the basic links in the WP menu.
So the benefit is being able to construct a menu exactly how the site needs it, AND also be able to manage basic top-level and dropdown links without having to edit the site header template in Bricks. I appreciate that it would require me to create multiple menus in WP (e.g. one for top level, one for each dropdown, etc).
I suppose another benefit would be being able to create a better mobile menu than the one that comes with Nav Menu on its own.
I haven’t got that far yet but I imagine that would require creating a more custom mobile menu with the offcanvas element, if the menu items were being pulled from the Nav Menu element?
As I say, from the documentation and my experiments, it seems this scenario has been catered for with Dropdowns, cos it looks like Bricks is stripping the Nav Menu element’s usual <nav> and <div> wrappers, so the nesting is nice and clean. But not when nesting Nav Menu at the top level.
It may be that the answer is simply, “it doesn’t work the same way at the top level, we don’t strip those wrappers out”. Would just be good to know what the situation is.
I saw your FB post on this and forgot to comment as it was late here when I saw it, but just checking… are you aware you can now add mega menus / custom dropdowns to the normal ‘nav menu’ element?
The nestable version isn’t needed if you’re needing the top level menu items to be coming from a WP menu, and you can still add the mega menu dropdowns and multi-level stuff in the regular nav menu element now.
I did see that, yes. And that’s definitely an option. But I’m still stuck with the mobile menu builder in Nav Menu (which isn’t great) and I don’t have the flexibility to add other elements, like a search form or a button, for example. That’s the sticking point for me, I think.
While i’m here, i do know the answer to the other question you asked.
The wrappers for the nav menu is only stripped out when the parent element has the hidden class ‘brx-dropdown-content’, which is only going to happen when it’s inside of a dropdown. This condition is hardcoded into the element, I don’t see a way of changing it from the outside. Definitely understand the use case you’re describing though.
Right now I’m building a site with a 2-parts menu on desktop (big main menu on more prominent place and the secondary menu in a smaller topbar), which should be joined together on mobile.
Both parts of the menu are populated using native WP menu builder and it would be much better, if I could use both of the menus as top level items both on the desktop and mobile.
I have to say, that I CAN insert Nav Menu element inside Nav Nestable and it seems to work, in a way. But the settings ov Nav Menu and Nav Nestable are conflicting and the native mobile menu is completely messed up (which I currently don’t care of, as I have done it by OffCanvas).
To sum it up, the Menu builder still needs some improvement.
I don’t quite understand how difficult it is to implement this, but I don’t understand why it hasn’t happened yet. Just need to create another source “Query Loop” for the “Menu” loop
This would be a solution to many problems.
