Alway open submenu

How To
1

I use a regular wordpress nav to display a two level menu in the footer and I would love that menu to be shown completely to display both level of the nav. What is the best solution ?

Thank you

2

Hey Loic,

are you using the regular Nav Menu element? If so please try the following custom CSS on the element:

root .sub-menu {
  display: revert;
  opacity: revert;
  position: revert;
  visibility: revert;
}

If you also want to hide the dropdown (button) icons:

root button {
  display: none;
}

Best,

André

3

I did not know about the revert css property!
Thank you, I learn everyday!

4

Hi guys, is it possible to achieve that the submenu is only expanded if a subitem is active?

1 Like
5

Hey André,

thank you. Now the submenu links are not clickable. Any idea how can I solve this?
Thank you again!

6

That’s what I use now for mobile menu (Nav Menu element), tested with Bricks 1.10.1:

<script>
// Run the script after the page has loaded
window.addEventListener("DOMContentLoaded", (event) => {
    // Get all the li elements with the 'menu-item' class
    const menuItems = document.querySelectorAll(
        ".bricks-mobile-menu li.menu-item"
    );

    menuItems.forEach((item) => {
        // Add the 'open' class to the element
        item.classList.add("open");
        // Add the 'active' class to the element
        item.classList.add("active");
    });
});
</script>```
7

Hey @HeroRox,

seems like Bricks added some custom CSS in one of the latest updates which prevents the links from being clickable in the mobile menu. With this adjusted CSS it should work as expected:

root .sub-menu {
  display: revert;
  opacity: revert;
  pointer-events: auto;
  position: revert;
  visibility: revert;
}

Best,

André

2 Likes
8

Works great, thanks @aslotta ! :sunglasses: :muscle: