Hi guys. I’m back. I had to leave Bricks after a burst on it nearly 2 years ago. You’re making great progress, with the builder as well as with the approach. Brilliant guys. Now I’m back in the saddle I’ve been looking at your new v1.8 mega menu as well as your older ‘Nav Menu’ - and whereas the older Nav Menu handles active/current item styling + psuedo states great (IE you can set a wide range active/current styles to both the Top Level and SubMenu level) you can’t set any active states in the Mega Menu. My view is that you need to be able to do this which I presume you have in progress or you do need more feedback?
IE Users need to be able to use nav menus not just to get around but also as a primary identifier as to where in the site they are. I’ll shortly upload a grab of a simple 2-level horizontal menu system I’m trying to build (that I can’t quite build using the older Nav Menu element either to demo a related query to you too.
In theory at least, your older Nav Menu element should be able to do this easily too but I can find no controls to set alignment for the Sub Menu items.
Here are the alignment controls for the Top Level items (which work great, easy to see, easy to update, etc, fantastic job on those):
But they only change the vertical/horizontal alignment of the Top Level menu. Note in the first grab (which is from a Drupal site using the Superfish menu system) ‘Lighting Hire’ is the active parent/page and ‘Festoon Lighting’ is the active child item and so on. NB users can clearly see where they are.
And so for your existing Nav Menu element the broad function missing is the ability to align subitems horizontally - which I imagine would be a relatively easy ability to add. I haven’t tried overriding with css yet but might also be simple.
Whereas the new Mega Menu option can create the a horizontal sub menu great it doesn’t (yet) support) active/current menu item styling (or classes to allow manual css updates on the current/active item).
It looks like the Mega Menu system as a whole is going to be great and having active/current item state support should, I imagine, make it more useful at some of the basics.
Meantime, would be glad to hear of any workaround - although I’m only working on new test Bricks builds so no urgency on that.
Keep up the great work - but looking forward to testing/developing further.
Hi guys. Have I posted this query in the wrong category?
The main query is if the new Mega Menu system will be able to support active (current item) states in the future? And when? It seems an omission at the top menu level.
Or are there any other suggestions from anyone on the example supplied… which would be a Woo primary categories (top level menu) + a secondary (woo subcategory) menu but both pulling active states (classes) from WP’s menu system so that I can re-style as needed.
Any suggestions/pointers would be appreciated. Many thanks.
The only way I’ve found - and it’s not a very good way… is to use the new dropdown element, set as mega-menu. Add a NAV to the drop-down - set as horizontal.
BUT… this means you have to build a main menu, and then a menu for each sub-menu… if you want to make it possible for clients to edit the menu.
Otherwise you have to build it entirely by hand and accept the client can’t edit it.
For top level pages you can style the active one with aria-current page. Doesn’t work for submenus though cause they all get it. I’m sure they’re working on something but for now, if you paste this in to your Body (footer) scripts in the Bricks settings, it adds the active class, also to links within a mega menu:
<script>
var current = 0;
for (var i = 0; i < document.links.length; i++) {
if (document.links[i].href === document.URL) {
current = i;
}
}
document.links[current].classList.add('active');
</script>
“home” still needs to be done via aria-current and it doesn’t highlight parent items. Not ideal but quick and easy enough to use temporary till an official solution is released.
