How to change behavior of Libretto theme menu

  • Unknown's avatar
    lmverberne · Member ·

    Hi,
    I have several submenu items which in itself have subitems. Under “Onderzoek”, “Instituten” there’s a third level “Centrale Adoptie Raad” which contains a fourth level.
    The problem with this is that on the right side of the page it exceeds the width of the browser (Chrome, Safari). On mobile the menu creates a menu word wrap, but not on the computer.
    How can I edit the code for it to either flip to the left side of the dropdown menu when the browser width is about to get exceeded or a word wrap so it won’t exceed the browser width? Or perhaps align the entire menu to the left instead of the right?

    Thanks,
    Lucas

    The blog I need help with is: (visible only to logged in users)

  • staff-totoro · Staff ·

    Hi there,

    From what I can see there is a bug in the way this theme handles dropdown menus. I’ve reported this to our theme team, but for now you can add the following custom CSS, which will correct the issue by moving the sub-menus over a bit and allowing the text to wrap so it is visible when you hover.

    #site-navigation .sub-menu li a {
    white-space: pre-wrap;
}

#site-navigation li:hover>.sub-menu {
    left: -50px;
}

    Hope this helps!

  • Unknown's avatar
    lmverberne · Member ·

    Hi Jerry,

    Thanks for your reply. I will have to add this to which file exactly? I tried adding it to the theme’s function.php, but my site was’t happy with that. So I undid the change.

    Thanks,

    Lucas

  • staff-mckluskey · Staff ·

    Hi Lucas,

    You should be able to add that from the Appearance Customize Screen, you’ll see a tab called Additional CSS there. Here’s more information about this:

    https://codex.wordpress.org/CSS.

  • Unknown's avatar
    lmverberne · Member ·

    Hi guys,

    I implemented it and it’s much better like this. It’s not perfect yet, but at least most of my menu is readable now.
    Can’t wait for the theme menu bug fix.

    Thanks a lot,

    Lucas

  • The topic ‘How to change behavior of Libretto theme menu’ is closed to new replies.