Archived topic
Shortcode for Mobile Hamburger Menu
22 replies · Started by Sars on October 2, 2020
Dear team,
I am using a blank slate template. Is there any shortcode that I can use so that the hamburger menu alone shows in desktop and mobile?
Thank you
Hi there,
In customizer > layout > primary navigation - manually set the Mobile Menu Breakpoint to a high value e.g 6000px. This will keep whatever mobile menu have displayed at all times.
Thanks a lot David for the support. I did as you have adviced. But I am unable to see the Hamburger menu on desktop as well as mobile.
Kindly help
Thank You
Looks like you're using a Page Builder that has a Blank Template that removes all of the Theme elements. Instead of using whatever blank template that is, set it to default.
You can create a full width page instead by using the Page Builder Container:
https://docs.generatepress.com/article/page-builder-container/
And you can remove Theme Elements your don't require using Disable Elements:
https://docs.generatepress.com/article/disable-elements-overview/
Thanks again David!
I have now manually set the Mobile Menu Breakpoint to a high value e.g 6000px
Disabled blank template
Used elements and Disabled navigation menus , footer, sidebar etc.
Now i have got a full width site.
But The hamburger menu is not yet there.
Please help
Thank you
Slideout Layout of generate press
A simple modern design with a fixed side bar that opens a slideout area.
This is the exact menubar that I am trying to get on the site David.
Could you kindly help please on how to install it on the site?
Looks like you found the option in Customizer > Layout > Off Canvas Panel.
Is it working correctly for you now ?
Yes David,
I found out
But there are 2 issues. One The menu is behind a dark background. I would like it to be transparent.
Another option is: How to enable the slide out menu used in one of your beautiful layouts "Slideout
A simple modern design with a fixed side bar that opens a slideout area.
"
Thank You
To remove the overlay background - add this CSS:
.slideout-overlay {
background-color: rgba(0,0,0,0);
}
To use Slideout you would need to import that site using the Site Library:
https://docs.generatepress.com/article/using-the-site-library/
We do not recommend you do this on a live site - they really are for starting a new site with.
Hi David, Sure, I added the CSS. But THe menu is still not transparent. I do not want the slideout layout. I want the vertical menu that is seen on the slideout layout with all the blogpost snapshots, etc.
Thank you
Hi there,
Just to confirm, you want the layout seen here?: https://gpsites.co/slideout/
Hello Tom,
Yes, I was able to bring the Slideout through David's Help. I just have one question. How to Bring the icons like https://gpsites.co/slideout/ for the Posts?
Thank you
You can import the Slider site - just skip the Step for Importing Content. I would suggest you do this on a staging site or after making a backup.
Thanks David,
Yes, I now did that. But still not able to see the fullwidth :(
You need to remove this in Customizer > Additional CSS:
.no-sidebar .inside-article > *, .no-sidebar #comments, .no-sidebar .nav-links {
max-width: 700px;
margin-left: auto;
margin-right: auto;
}