Site logo

Archived topic

Custom Header with only single button nav

5 replies · Started by Mangesh on December 23, 2021

Viewing posts 1–6 of 6

Hi There,

I hope you guys having a great day!

I need help creating a header like this https://ibb.co/smpn701

I tried adding a custom button which was added. but the problem is how to hide the navigation?

So could someone help me achieve this UI https://ibb.co/smpn701
it should load the same on mobile as well just a logo and a button.

Thanks,
Mangesh

Hi there,

create an Empty Menu in Appearance > Menus and set its Location to Primary Navigation. This will remove the default menu.
For the button, create a new Block Element:

https://docs.generatepress.com/article/block-element-overview/

Add your button.
Set the Element Type to Hook. And select the menu_bar_items hook.
Set the Display Rules to Entire Site.

Great thanks David for the faster reply.

One quick question. when I created an empty menu on the desktop it worked. but on mobile it shows 3line nav icon even if the menu is empty https://ibb.co/sC3jdPr

Waiting for your reply!

Thanks,
Mangesh

Try adding this CSS to hide it:

nav.main-navigation .menu-toggle {
    display: none;
}

Wow perfect! Thanks again David!!

Glad to be of help!

This archived topic is closed to new replies.