Altitude Pro — added "hamburger" menu to home page and it defaults to "expanded

[kvmolino]

I apologize in advance for the length of this but it will be hard to solve without the background info. My client wants her site to have a "hamburger" menu right from the homepage all the way through. Another forum member gave me the code below which works but it defaults to "expanded" status. He said this was because I had non-Genesis-standard CSS classes being used and said this was due to some other customization. He also said the code to replace was at line 1151. So I did a completely vanilla install of Genesis and Altitude Pro at another location and used his instructions but (1) the responsive menu code was nowhere near line 1151 "out of the box" and (2) the code below works when I use it to replace the /*Responsive Menu */ code EXCEPT for the default to non-collapsed status.

From the forum responder:
(first reply)
"Code: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;
}

Second reply when I told forum member it didn't work:
"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."

So now I have added the code to a clean install out of the box. As I said, all is PERFECT except the menu selection box should be collapsed when you hit the site, not yet expanded to show the menu items -- we want to leave that choice up to the visitors. ANY ideas would be greatly appreciated!!!

http://kristamolino.com

[Christoph]

Hi,

with the latest update of Altitude Pro, some class names have changed.

Try replacing

.genesis-nav-menu.responsive-menu

with
.genesis-responsive-menu

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[kvmolino]

Thanks SO much for your reply! I thought this one was dead in the water. So I would add the CSS above as-is EXCEPT for the .genesis-responsive-menu?

Also I'm curious...do you happen to know how long ago the update issued? I just downloaded the Altitude Pro theme about 2 months ago.

[kvmolino]

OK, so, yes changing that class name keeps the hamburger menu (when the site is full size, on a computer screen) from opening in its active state. But now it doesn't show the menu at all, active or inactive. Maybe I just have to give up on this one!

[Christoph]

Hi,

Yes, exactly.

You can see when the theme was last updated on the downloads page.
A lot of themes where updated with the launch of Studiopress Sites at the end of January.

The website you linked to doesn't have the changed code so I don't know what you are seeing.

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[kvmolino]

This reply has been marked as private.

[Christoph]

Only you and moderators / admins of this forum can see posts/responses that you mark as private.

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[Author]

Posts