Archived topic
getting hamburger to show up on mobile screens
3 replies · Started by Clyde on June 2, 2021
I'm creating a custom menu on one of my pages. Here is the page: https://universalsalons.com/wavelinks/
To do this I disabled my main header and created a custom header just for this page. The issue is that when the menu shows on a mobile device, I need it to show a hamburger rather than list the menu. I'm using a grid inside a container. Is there any way to switch from the menu I made to a hamburger symbol when this page is seen on a mobile device?
Hi there,
simple answer - no :)
But that design would be pretty simple to create with the theme site header.
If you want to give that a go then remove the custom header and set the Site Title and Tag Line in Site Identity and set the Navigation to Float Right - then i can help with making it look like that.
The issue is that the Site title and Tag Line for this page will be different than the rest of the site. The background color will be different also. Is it possible to create a custom header using a different site title and tagline along with a custom menu?
The issue is that the Site title and Tag Line for this page will be different than the rest of the site. The background color will be different also. Is it possible to create a custom header using a different site title and tagline along with a custom menu?
It's going to be real tedious but it should be possible to make your own header by removing the default header and insert your own custom one.
Removing the default header should be as simple as adding this filter -
https://docs.generatepress.com/article/generate_header/
Adding a new one can be either by code on Hook element or by Block editor using Block Element. But the same hook is used which is generate_header. The problem here is, you're on your own because you're basically removing the default theme header for your own custom one.
Now if what you want is simply to change the contents of the logo, site title and site branding depending on the page, you can use the following filters -
generate_site_title_output - site title filter
generate_logo_output - site logo filter
generate_site_branding_output - site branding filter.
You then have to do a bit of PHP coding for the conditions. Example if(is_front_page()){ //do something. }
