[Resolved] 2 menus in the same header row

Home Forums Support [Resolved] 2 menus in the same header row

Home Forums Support 2 menus in the same header row

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #2263080
    Tomáš

    Hello,

    I would like to ask you how can I position two sepparate menus (primary & secondary menu) in the same header row.

    What I am trying to achieve is to have a logo on the left, primary menu in the center and then the secondary menu on the right.

    Any help is much appreciated.

    #2263122
    David
    Staff
    Customer Support

    Hi there,

    quick question – is there any specific need to have 2 separate menus ? As it would be possible on desktop to make split a single menu into two using some CSS?

    Let me know

    #2263130
    Tomáš

    Well when I think about it, there is really a need for only one menu.

    On the image below, you can see what I am trying to achieve.
    https://ibb.co/Kqww1NK

    Basically, it is the logo on the left, menu links in the center of the header and then menu icons (cart, account) on the right.

    However I don’t know how I could split the menu so that the menu links would be precisely in the center of the header, while menu icons (cart, account) would stay on the right side of the header.

    #2263144
    David
    Staff
    Customer Support

    OK – thats good as it means there won’t be 2 x menus on the mobile device 🙂

    Add this CSS:

    @media(min-width: 769px) {
    
        .main-navigation {
            flex: 1;
        }
        .main-navigation .main-nav {
            margin: auto;
        }
        
    }

    The menu will be centred between the Logo and the Menu Bar Items where the Cart Icon would positioned.

    If you want to add other icons beside the Cart then you can use a Block Element:

    https://docs.generatepress.com/article/block-element-hook/

    And set the Hook to: menu_bar_items

    Any content within will appear beside the cart on desktop and also beside the cart and hamburger on mobile.

    #2263162
    Tomáš

    Excellent! Wokrs perfect. Thank you David.

    #2263183
    David
    Staff
    Customer Support

    Awesome – glad to hear that!

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.