[Resolved] GP subtheme Prime hamburger button location

Home Forums Support [Resolved] GP subtheme Prime hamburger button location

Home Forums Support GP subtheme Prime hamburger button location

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1616309
    jr

    Hello,

    How can the hamburger button be displayed before the primary menu, currently it gets placed after the cart button.

    thank you,

    #1616343
    Ying
    Staff
    Customer Support

    Hi JR,

    I don’t quite understand your issue here. The default Prime mobile view looks like this:
    https://www.screencast.com/t/Yr0gYEJkTjh5
    Are you seeing it differently?

    Let me know ๐Ÿ™‚

    #1617340
    jr

    Hello,

    In desktop view, it appears after the cart button.

    How can it be set before the primary menu in desktop view?

    thank you

    #1617612
    Leo
    Staff
    Customer Support

    We will need to see the page in question to be able to assist.

    Can you provide that in the private info field?

    Thanks!

    #1617678
    jr

    This is what we are trying to accomplish:
    https://i.postimg.cc/nzgVKszR/GP-20210113-hamburger.png

    thank you

    #1617735
    Leo
    Staff
    Customer Support

    We will need to see the page in question to be able to assist.

    Can you provide that in the private info field?

    Thanks!

    #1617794
    jr

    Hi Leo,
    more details sent.

    #1617832
    Leo
    Staff
    Customer Support

    I went to our default Prime install and activated the off canvas menu for both desktop and mobile and this is what I see:
    https://www.screencast.com/t/XYt5VtBZSl

    I don’t really want to provide my IP in a public forum here. Can you start a staging site so I can view the issue quickly?

    Or we can revisit the issue once the site is live – should be an easy fix once we have something to look at.

    #1617883
    jr

    Hi,

    using your example of default Prime:
    https://i.postimg.cc/Hn9fT2n7/GP-20210113-hamburger-2.png

    how can the hamburger icon be move before the primary menu (before the Tshirt category)

    thank you

    #1617913
    Leo
    Staff
    Customer Support

    Ahh sorry I misunderstood your question.

    The easiest way is actually to add the toggle as a custom link menu item in the menu.

    Use # as the URL field.

    This would be the navigation label:
    <span class="gp-icon pro-menu-bars"> <svg viewBox="0 0 512 512" aria-hidden="true" role="img" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em"> <path d="M0 96c0-13.255 10.745-24 24-24h464c13.255 0 24 10.745 24 24s-10.745 24-24 24H24c-13.255 0-24-10.745-24-24zm0 160c0-13.255 10.745-24 24-24h464c13.255 0 24 10.745 24 24s-10.745 24-24 24H24c-13.255 0-24-10.745-24-24zm0 160c0-13.255 10.745-24 24-24h464c13.255 0 24 10.745 24 24s-10.745 24-24 24H24c-13.255 0-24-10.745-24-24z"></path> </svg> </span>

    Then add slideout-toggle as the CSS class.

    https://www.screencast.com/t/dUiUFg4p9T

    #1619089
    jr

    This adds the hamburger before the Tshirts category, but the “default” hamburger still appears after the shopping basket… how can the default hamburger be removed in the desktop now that its been added to the menu per your code?

    Thank you for all your help.

    #1619095
    Leo
    Staff
    Customer Support

    Try this CSS:

    .menu-bar-items .slideout-toggle {
        display: none;
    }

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

    #1619185
    jr

    perfect. thank you.

    #1619258
    Leo
    Staff
    Customer Support

    No problem ๐Ÿ™‚

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