[Resolved] Mobile menu code

Home Forums Support [Resolved] Mobile menu code

Home Forums Support Mobile menu code

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • #2187427

    Hi I’m looking for the mobile menu code could you please help.

    Implementing the code from this website just need to echo out the mobile menu dropdown.


    /* The below code checks if a mobile-menu is set from the backend in the menu settings. If a menu has been set it will be displayed in the header. Or else, a menu has not been set then display a message.*/
    if ( function_exists('has_nav_menu') && has_nav_menu('mobile-menu') ) {
          echo "";
    } ?>
    Customer Support

    Hi there,

    why not use the Mobile Menu built into GP ? What am i missing 🙂


    The drop down menu looks fine in mobile but is spread out on a desktop website browser. I would like them to look pretty much the same. so two menu’s. Canvas doesn’t offer a drop down menu. So if I could get the code for menu by name that would be great.


    Or a way to remove the top level of submenu from mobile and just display the second categories.

    Customer Support

    Can i see the site so i can get a better understanding of the changes


    Sorry site isn’t live at the moment. Here are the menu’s though.

    Firefox browser menu

    Mobile menu

    Customer Support

    Hi Fred,

    If you’re wanting to make the Nav identical for Desktop and mobile more or less, wouldn’t setting the Mobile menu breakpoint to either 2000 or 0 work? This can be found in Appearance > Customize > Layout > Primary Navigation: https://share.getcloudapp.com/lluEgKLG

    If you’re referring to something else, may you kindly take a larger screenshot of both? Kindly try including the entire header.

    Hope to hear from you soon. 🙂


    Found a work around. This opens the mobile menu so you don’t have to click twice, and hides the extra menu item in mobile menu.

    .main-navigation.toggled .main-nav ul ul.sub-menu {
            position: relative;
            top: 0;
            left: auto!important;
            right: auto!important;
            width: 100%;
            pointer-events: auto;
            height: auto;
            opacity: 1;
            display: block;
            visibility: visible;
    .main-navigation.toggled .main-nav li:last-child > a {
    Customer Support

    Glad you found a workaround! Feel free to reach out anytime you’ll need assistance with anything else. 🙂

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