Archived topic

Hide header but still keep the header widget

3 replies · Started by yig on November 19, 2019

Viewing posts 1–4 of 4

November 19, 2019 at 10:32 am #1067665

Hi there,

I decided to hide my header from both mobile and desktop to move on with the navigation menu with a logo only.

However when I hide the header, the header widget area also gets hidden. Is there a way for hiding the header but still keeping the header widget?

I used the following code for hiding the header:

/* hide header */
.site-header {
	display:none
}

Thanks very much in advance!

November 19, 2019 at 3:31 pm #1067849

Hi there,

why not use the Top Bar widget area instead of the Header Widget?

November 21, 2019 at 2:12 pm #1071458

Hi David!

Thanks for your response, sorry I missed it, I guess I forgot to turn on the notifications. Meanwhile I found another solution though :)

I was using Top Bar for another purpose, above the Navigation Bar. So I wanted to use the Header Widget Area below the Navigation Bar. And I wanted to be able to hide it on mobile or desktop with an additional css.

Then I discovered the abilities of Elements and Hooks :) I was a bit confused about them in the beginning, but apparently they are pretty simple to use and have a lot of customisation options.

I made some hooks by adding <div class="hide-on-desktop">content</div> and added them above content. Problem solved :)

Thank you very much!

November 22, 2019 at 5:05 am #1072239

Glad to hear that !

This archived topic is closed to new replies.

Start building better websites today.