Hide Header but keep menu

Resolved nixiemartyn
(@nixiemartyn)

9 years ago

Hi and thank you for an awesome plugin, Takanakui!
The update and option to display at all resolutions are great for my use.

However, is it possible to hide the mobile header (.mob-menu-header-holder) and still see the hamburger icon and get access to the mobile menu?

I am using the Genesis Framework and somehow the mobile header is always visible, even when I am scrolling down my page. I can make the mobile header background color the same as the rest of my genesis header, but not adjust the height or width without strange things happening. And also the mobile header follows the page so it will be visible on top at max browser width. Hiding the header removes the hamburger icon as well.

Site with the issue at this link: http://bit.ly/2iA69DE

Thank you for your help and keep up the good work!

I tried this fix which works for now:

.mob-menu-header-holder {
background-color: #2D2D2D!important;
}

.mob-menu-header-holder .headertext {
display: none!important;
}

Viewing 11 replies - 1 through 11 (of 11 total)

Plugin Author Rui Guerreiro
(@takanakui)

9 years ago
Hi,

What I would suggest is similar to what you have.
```
.mob-menu-header-holder {
    background-color: transparent!important;
}
.mobmenu .headertext {
    display: none!important;
}
```
If I understood correctly you hide to hide the burger icon after scrolling down?

-Takanakui
Thread Starter nixiemartyn
(@nixiemartyn)

9 years ago

I like to keep the hamburger icon after scrolling down, and now it does! What I’d like to do is to remove the mobile header so that there is only the hamburger icon:

Setting the background-color to transparent made the header no longer visible when scrolling down the page – which is good. (If i set the background color to any color the mobile header would be visible on top at all times when scrolling).

However, there seems to be some sort of padding or space that the mobile menu uses on top of/before the WordPress header. After setting the background color to transparent I now get about a 10 px box on top of my header. Here marked in yellow:

I can set the body background color to match my header and not use yellow obviously, but that will still make it fill the the full width of the browser even if my header is set to a fixed smaller width.

I tried to remove padding/size of the mobile menu header, but can’t seem to make it disappear.

Thanks for your help!
Nixie

Thread Starter nixiemartyn
(@nixiemartyn)

9 years ago

Image showing the mobile header marked in yellow is at https://www.dropbox.com/s/bov7vziqye5gr95/mobilemenuheader.jpg?dl=0
Plugin Author Rui Guerreiro
(@takanakui)

9 years ago
Add this code to the custom css option and check again.
```
.mob-menu-header-holder {
    height: 0px!important;
}
```
-Takanakui
Thread Starter nixiemartyn
(@nixiemartyn)

9 years ago

Thank you, Takanakui!

That removed the mobile header, but kept the hamburger icon.
I really appreciate the quick response and your awesome plugin!

Regards
Nixie
Plugin Author Rui Guerreiro
(@takanakui)

9 years ago
It was missing this code.
```
#dropdown-nav-wrap, #dropdown-subnav-wrap {
    display: none!important;
}
```
That should sort it.

-Takanakui
Thread Starter nixiemartyn
(@nixiemartyn)

9 years ago

No good, that just killed the Genesis Responsive Navigation!
It worked just fine not using that code!

Thanks!
Plugin Author Rui Guerreiro
(@takanakui)

9 years ago
Maybe I got it wrong, if it’s just the hamburger icon from genesis add this code.
```
#dropdown-nav .responsive-menu-icon{
  display: none!important;
}
```
Not sure if you want to remove that part that says “Navigasjon”

Let me know.

-Takanakui
Plugin Author Rui Guerreiro
(@takanakui)

9 years ago

@nixiemartyn Let me know the result. Will close the topic for now.

-Takanakui

Thread Starter nixiemartyn
(@nixiemartyn)

9 years ago

I hid the the whole responsive navigation from Genesis / the area that says navigation. So I am only using Mobile Meny at the moment and it looks great!

Thank you for your help as always, Takanakui!

Regards
Nixie

Plugin Author Rui Guerreiro
(@takanakui)

9 years ago

No problem. Glad it’s sorted.

-Takanakui

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Hide Header but keep menu’ is closed to new replies.

Tags