Archived topic

Disable Mobile Menu for Primary Navigation

4 replies · Started by Vish on May 16, 2021

Viewing posts 1–5 of 5

May 16, 2021 at 4:59 am #1782595

I would like to show the full menu on mobile view.

Current setup:
1. Using header (No navigation as header).
2. Mobile menu not enabled.
3. On desktop, the menu is shown in the left sidebar.
4. On mobile, the menu is shown as a hamburger icon under the site logo. (Instead of this, I just want to show all the menu items under the site logo).

I have also included the site url.

Any pointers would be of great help, thanks!

I spent some time looking at old topics regarding this and also tried the recommended solutions but they don't seem to work for me (perhaps their setup is different?).

May 16, 2021 at 9:39 am #1783071

Hi Vish,

Try to set the mobile break point to 0.
https://docs.generatepress.com/article/mobile-navigation/#initiating-the-mobile-navigation-at-a-different-width

Let me know if it works for you :)

May 16, 2021 at 9:39 am #1783073

Hi there,

try this CSS:

@media (max-width: 768px) {
    .main-navigation:not(.slideout-navigation):not(.toggled) .main-nav>ul {
        display: flex !important;
    }
    #site-navigation .menu-toggle {
        display: none;
    }
    #site-navigation .inside-navigation {
        justify-content: center;
    }
}

May 16, 2021 at 9:22 pm #1783593

It worked! Thanks, David!

May 17, 2021 at 3:41 am #1784098

Glad to be of help

This archived topic is closed to new replies.

Start building better websites today.