Vertical Menu on website – how to edit?

This topic has 4 replies, 2 voices, and was last updated 1 years, 5 months ago ago by Rose Tyler

  • Avatar: PR
    PR
    Participant
    June 29, 2023 at 21:39

    Hello,

    We are looking into adding the vertical menu, just to add more sections where we can keep information on the website.

    On this demo; https://xstore.8theme.com/elementor/demos/home-decor/

    1) Once someone clicks the 3 bars (to open the menu) and once the menu comes out, is there anyway to add a scroll bar if you have lots of menu items?

    2) can we connect the menu items to static blocks so we can add mega menus there?

    thanks for your help!

    3 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    June 30, 2023 at 08:44

    Hello,

    Thank you for choosing XStore as your WooCommerce WordPress theme.

    1/ The next custom CSS code can be used:

    #header-vertical .et-mini-content.active {
        overflow-y: scroll;
    }

    2/ Yes, but some custom CSS code should be used, for example, https://prnt.sc/y7nzCYoLaQSk

    #header-vertical .et_b_header-menu li>.nav-sublist-dropdown:not(.nav-sublist) {
        position: absolute;
        left: 290px !important;
        width: 1000px !important;
    }

    Please note that both custom codes can’t be used together.

    Kind Regards,
    8theme team

    Avatar: PR
    PR
    Participant
    June 30, 2023 at 22:41

    Hello Rose,

    thank you very much for the code.

    just some more questions if you do not mind;

    1) is there anyway to remove the bottom scroll that also appears? once we add the first code, the side scroll comes (which is needed) but then, a small bottom scroll bar also appears and seems of no purpose.

    2) we did not add code #2, but added code #1, and the mega menu (static block) feature which came automatically was not working when the scroll code was added.

    Can anything be done to make both features work?

    Thanks!

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    July 1, 2023 at 09:49

    Hello,

    1/ Please try:

    .site-header-vertical .et_b_header-menu .item-design-dropdown .nav-sublist-dropdown:not(.nav-sublist) {
        overflow: hidden;
    }

    2/ No, it is not possible to make both features work together, unfortunately.

    Kind Regards,
    8theme team

  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.