Docs

[iTurtle]

hi there,
i was hoping with ubermenu i would be able to create a very simple (too simple it seems for most menu-plug-ins) vertical menu. always open (showing the subpages). just like the one in the attached screenshot.
is that possible with ubermenu? i did not succeed so far… maybe another plugin? must be responsive, though.
thanks a million! regards, kai

[Rue Nel]

Hello There,

Thanks for writing in! That may not be possible with Ubermenu. Please check out the possibilities here: http://wpmegamenu.com/

For the meantime, using the default nav menu in X, you can achieve something like the example if you will set your nvabar as Fixed Left or Fixed Right which you can do that by going to the customizer, Appearance > Customize > Header > Navbar Position. And once you have positioned it, you’ll going to need to add the following css code in the customizer, Appearance > Customize > Custom > CSS

.masthead-inline .x-navbar.x-navbar-fixed-left .desktop .x-nav>li > .sub-menu,
.masthead-inline .x-navbar.x-navbar-fixed-right .desktop .x-nav>li > .sub-menu {
    position: relative;
    margin-left: 20px;
    display: block;
    right: auto;
    left: auto;
    top: auto;
    float: none;
    box-shadow: none;
}

.x-navbar-fixed-left .desktop .x-nav>li>a, 
.x-navbar-fixed-right .desktop .x-nav>li>a {
    text-align: left;
}

Hope this helps. Kindly let us know.

[iTurtle]

thanks so much! this looks good and i do not need to use an extra menu plug-in 🙂

i tried but did not succeed to move the submenu buttons closer together and make the arrows on the right of the main menu buttons disappear.

would you be so kind and help out again?

best regards! kai

[Thai]

Please add the following CSS:

.x-navbar .desktop .x-nav li>a>span:after {
    display: none;
}
.desktop .x-nav>li > .sub-menu {
    padding-top: 0;
}

Hope it helps 🙂

[iTurtle]

thanks again! the second css you send me moved the whole submenu closer to the main buttons.
i found this:

.desktop .sub-menu a {
line-height: 0.8;
}

to move the submenu items closer together. hope that is correct code? it seems to work, though 😉
thanks again for your fast and generous help!
best wishes, kai

[Rupok]

Hi there,

Thanks for updating. Yes adjusting line-height should solve the issue. As it’s working, you can go with that.

Cheers!

[Author]

Posts