[Support request] Off Canvas menu configuration

Home Forums Support Off Canvas menu configuration

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1292169
    Kir29 LLC

    Hi,

    We are using the Off Canvas menu for desktop/tablet/mobile and we would like to change a couple of settings (see our live site menu):

    1) How can we change our menu and sub-menu alignment from centered to left?
    2) How can we get rid of the line created between ‘Featured Articles’ and ‘About Us’?
    3) How can we configure our ‘Destinations’ sub-menu item expanded by default?
    4) How can we replace our menu item ‘HOME’ for a home icon?

    Could you please advise?

    Thank you

    #1292851
    Leo
    Staff
    Customer Support

    Hi there,

    1. Try this CSS:

    .main-navigation.slideout-navigation .main-nav ul li a {
        text-align: left;
    }

    2. Try this CSS:

    .main-navigation.slideout-navigation ul ul {
        box-shadow: none;
    }

    3. Try this CSS:

    #generate-slideout-menu.main-navigation ul li ul {
        display: block !important;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        height: auto;
        overflow: visible;
    }

    4. You could consider a plugin like this:
    https://en-ca.wordpress.org/plugins/menu-icons/

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #1293371
    Kir29 LLC

    Hi again,

    1) Works perfectly for the main menu items. Is there a way to have the sub-menu items aligned to the left (as they are) but adding a couple of caracteres of justification (so it’s visually clear that they are part of the sub-menu)?
    2) Works perfectly. Thanks
    3) We tried and the sub-menu loads expanded by default but unfortunately when we click on ‘Destinations’ to collapse the sub-menu it doesn’t work (we’d like to have it expanded by default but not to losing the functionality of collapsing)
    4) Thanks for the suggestion. It sounds overdoing having to use a new plugin for one image so we’ll have to pass.

    Thank you again for the help

    PS: You can see the changes in our current staging area: http://db9.397.myftpupload.com/

    #1294046
    Leo
    Staff
    Customer Support

    1. Try this CSS:

    .main-navigation .main-nav ul ul li a {
        padding-left: 60px;
    }

    3. Can you try click instead of hover?
    https://docs.generatepress.com/article/navigation-dropdown/

    #1294196
    Kir29 LLC

    Hi again,

    1) There was a missing ‘{‘ but adding it your suggestion works perfectly:

    /* Arrange espacing of justification for sub-menu items */
    .main-navigation .main-nav ul ul li a {
    padding-left: 75px;
    }.

    Let us need to try 3) and get back to you.

    Thanks

    #1294396
    Leo
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.