[Resolved] Right side hamburger menu on desktop with centered logo

Home Forums Support [Resolved] Right side hamburger menu on desktop with centered logo

Home Forums Support Right side hamburger menu on desktop with centered logo

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1614476
    Alex

    I’ve made the main navigation with centered logo look like in Split theme on my site. Can’t figure it out how to make the desktop version look like mobile with right hamburger. Increasing mobile menu breakpoint shifts the logo leftside.

    #1614541
    David
    Staff
    Customer Support

    Hi there,

    little unclear on this – are you trying to display the Hamburger menu on desktop ( in place of the default desktop menu ) ?

    #1614548
    Alex

    Yes, I’m trying to apply hamburger on both desktop and mobile.

    #1614572
    David
    Staff
    Customer Support

    Simplest option is to increase the Mobile Menu Breakpoint in Customizer > Layout > Primary Navigation, in the field type a large number eg. 6000px. This will force the mobile header to be always displayed.

    Then you can replace your center logo CSS with this:

    /* Centet mobile header logo */
    #mobile-header {
        position: relative;
    }
    #mobile-header .navigation-branding {
        margin: unset;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%);
    }
    /* Position hamburger on right of screen */
    #mobile-header .menu-toggle {
        margin-left: auto;
    }
    #1636575
    Alex

    Thanks for your support, David!

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