Altitude Pro — "Hamburger" responsive menu on home page

[kvmolino]

My client wants to have the header menu always be the "hamburger" menu that you get when the screen resizes and the text menu collapses. I tried a plugin but it was a nightmare ... am willing to use a plugin if anyone has had good results with one. Also searched through the functions.php and the styles.css, and I didn't see anything that looked like it might achieve what I want.

Anyone?

Thanks!
Krista

http://virtuosova.com/sos

[Victor Font]

The hamburger menu display is controlled entirely by CSS. All you have to do is move the CSS that displays the hamburger out of the media query and into the main styles. Edit style.css and around line 1151, replace the responsive menu CSS with this:

/* Responsive Menu
--------------------------------------------- */

.genesis-nav-menu.responsive-menu {
	display: none;
	float: none;
	padding-bottom: 20px;
}

.responsive-menu-icon {
	cursor: pointer;
	display: block;
	margin-bottom: 10px;
	text-align: center;
}

.responsive-menu-icon::before {
	color: #fff;
	content: "\f333";
	font: normal 24px/1 "dashicons";
	margin: 0 auto;
}

.nav-secondary .responsive-menu-icon {
	margin: 10px auto 0;
}

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[kvmolino]

Thanks so much for this! It's great to finally see my header getting near what I want. I do still have an issue, though: the menu is defaulting to its "open" state when you arrive at the site. Same link. Suggestions?

Thanks again.

[Victor Font]

When I look at your source code, I see CSS classes that are not coming from Altitude Pro. There is a class named genesis-mobile-nav. Do you have some kind of plugin installed? The code I gave you is for Altitude Pro out of the box. If you are using anything else to help with the mobile menu, it is interfering with the Altitude Pro CSS. I can't help you with that.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[kvmolino]

Understood. I did in fact install a plugin for a responsive menu, then eventually deactivated and deleted it -- that must be where the extraneous CSS came from. I'll remove that. Thanks again!

[kvmolino]

I searched through all the style.css files associated with the site and I can't find the class you're referring to. I see it in Firebug, just not sure how to locate and eliminate it.

Sorry to be so thick about this.

[kvmolino]

OK, I see now that it's generated by an inserted .js file. Thanks for your help pointing me to the unidentified class.

[kvmolino]

This reply has been marked as private.

[Author]

Posts