Archived topic
Custom Header with only single button nav
5 replies · Started by Mangesh on December 23, 2021
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!