How can I make the mobile sub-menus expanded by default?

  • First off thanks for a great theme.

    For the mobile menu, pressing on the stack icon opens the menu but any sub-menu is closed by default and requires used to press on the down-arrow to toggle it open. Is there a way for me to have sub-menus open by default on the mobile menu?

    I noticed it’s controlled by “aria-expanded”. It’d be nice to be able to set the default value to “true”.

    Thank you.

Viewing 15 replies - 1 through 15 (of 19 total)

  • Hi @dbazhinov ,

    This feature is not available at this moment. We will make a note of your suggestion.

    Regards,
    Deepak

    Thread Starter dbazhinov

    (@dbazhinov)

    Hi Deepak @brainstormteam,

    Thanks for noting my idea as a suggestion! Would you happen to know of a work around for the time being?

    Thank you.

    Hi @dbazhinov ,

    As of now, there is no workaround as it needs a major tweak done to achieve that.

    If it is urgent, then you can hire a freelancer who can do that for you.

    Regards,
    Deepak

    Thread Starter dbazhinov

    (@dbazhinov)

    For those looking to show the sub-menu without requiring the user to have to click the arrow key on the other side of the menu, here’s an easy CSS workaround that will force-show all sub-menus as expanded (in mobile).

    Add to your CSS:
    .menu-item-has-children .sub-menu {
    display:block!important;
    }

    It’s not an ideal solution, and you won’t be able to toggle/hide the sub-menus on the arrow click. If you want to hide the arrow icon altogether:
    .ast-menu-toggle {
    display:none!important;
    }

    ˉ\_(ツ)_/ˉ

    Thank. What I needed.

    yessoftmk

    (@yessoftmk)

    @dbazhinov thanks

    @brainstormteam waiting thx. And need astra mobile menu in custom elementor header

    Hello @yessoftmk

    It won’t be possible to display the Astra’s Mobile Menu in Elementor’s Custom Header as they both work in a different manner.

    You can try using the Elementor-Header Footer and it should help create custom Menu using Elementor as required. Or you can use Nav Menu module of the Astra Pro plugin to create Mega Menus.

    Also, regarding the Open the Sub-Menu items by default, haven’t been taken up yet. If feasible to be added you can expect the same in our future releases.

    I hope that helps.

    Regards,
    Suman

    Any word on this, @brainstormteam ? Curious if you guys have been able to implement this, by chance?

    The hack that @dbazhinov provided is good, but doesn’t allow for closing the mobile menu at all.

    Otherwise, your theme is great!

    Thanks.

    Hello @sh10151

    We haven’t taken up this feature to be added yet. If feasible to be added and we receive more requests you can expect the same in our future releases.

    Do let us know if there’s anything else we can help you with.

    Thank you @dbazhinov!!! Great suggestion. made me look like a hero! ??

    yes i also need this feature!!

    option 1: open by default
    option 2: toggle on click (on the actual menu item, not on the toggle arrow)
    option 3: toggle on click on the toggle arrow

    please add this feature!
    thanks for a great theme

    There is a very simple CSS solution for this!

    Instead of forcing the menus to always be open, which is not so… very… yeah.

    Here goes:

    button.ast-menu-toggle {
    width: 100% !important;
    padding-left: 90% !important;
    border: 0 !important;
    color: #000 !important;
}

    Tip! Color can be whatever you need.

    Enjoy!

    Thank you @seomediagroup! That works beautifully! ??

    That’s perfect, @marteens !

    Do mark the topic as resolved if possible @dbazhinov . ??

    @marteens Np, you’re very welcome!

Viewing 15 replies - 1 through 15 (of 19 total)
  • The topic ‘How can I make the mobile sub-menus expanded by default?’ is closed to new replies.