[Resolved] Remove hamburger menu (mobile)

[russel]

I want to remove the hamburger menu on mobile and place all the categories directly.

how can I do that?

[Elvin]

Hi there,

Go to Appearance > Customize > Layout > Primary navigation and change the Mobile Menu Breakpoint value to 0px.

And then, if you want to replace the menu on mobile, you can do it with this PHP snippet:

add_filter( 'wp_nav_menu_args', function ( $args ) {
    if ( 'primary' === $args['theme_location'] ) {
        if ( wp_is_mobile() ) {
            $args['menu'] = 'Your Menu name for mobile';
        } 
    }
    return $args;
} );

Change Your Menu name for mobile to the name of the menu you’re going to use for mobile. 😀

[russel]

thank you 🙂

how to reposition the menu (mobile)? I want to make it look like this:

Moved to private section

[Elvin]

how to reposition the menu (mobile)? I want to make it look like this:

Did you include an image? It didn’t seem to get added into the reply.

You can use image sharing sites we’ve recommended here – https://docs.generatepress.com/article/using-the-premium-support-forum/#uploading-screenshots – to share your images. 🙂

[russel]

I forgot to mention that i need to remove the search function on mobile to achieve this look

[Elvin]

The search icon can be removed through Appearance > Customize > Layout > Primary navigation as well.

In this setting, you should see this – https://share.getcloudapp.com/04u5jK1N . Set it to “Disable” to remove the search function.

As for the repositioning: it should align similar to the screenshot provided once the search icon is removed as it space will free up for it to look similar. 😀

[russel]

After tinkering a bit, I Got it working thanks! 🙂

I’ll ask it here since it is relayed on menu navigation.

I also want to add a menu on the footer, mainly for the privacy policy and contact page.

How can I do that?

[Elvin]

I also want to add a menu on the footer, mainly for the privacy policy and contact page.

How can I do that?

There are different ways of doing that.

One way of doing it is to add a Navigation menu block in one of the Footer widget areas on Appearance > Widgets.

Another way is by making your own footer layout by creating a Block Element – Site footer. https://share.getcloudapp.com/9ZuR1AKe

[russel]

One way of doing it is to add a Navigation menu block in one of the Footer widget areas on Appearance > Widgets.

The pages are shown as columns, how to make it a row?

[Elvin]

Try adding this CSS:

aside#block-10 ul {
    display: flex;
}

aside#block-10 ul li:not(:last-child) {
    margin-right: 12px;
}

You can adjust the spacing between them by changing the margin-right value. 🙂

[russel]

It works now! thank you!

Last question, how can I change the order of the menu?

I want the “privacy policy” to be the first in row for example

[Elvin]

You can change the order of the menu on Appearance > Menu.

Select the menu you’ve used on the footer and change it’s sorting order from there. 😀
(Place Privacy Policy on the top of the list so it goes first)

[russel]

Thanks!

[Elvin]

No problem. 🙂

[Author]

Posts