Hiding the regular header, but not hiding the fixed header

BB Theme
1

I’m interested in hiding the regular header but not the fixed header. This will only be for the home page. The idea is that, at first, there is no header/navigation, but then when scrolling the fixed header appears.

I used the following:
.home .fl-page-header {
display:none;
}

This got rid of the header…but it also got rid of the fixed header. I tried a whole bunch of variations on the available classes with no luck. Is there a solution?

Any help would be great!

2

Hey Joel,

Thanks for getting in touch! Try this CSS snippet and see if it works for you.

.home .fl-page-header-primary {
  position: absolute;
  left: -9999px;
}

Let us know how it goes! :slight_smile:

Ben

3

Ben!

That worked! Thanks for the solution!

I just realized and became concerned about something…I guess I needed to sleep on it :slight_smile: Will hiding the navigation like this hurt page rankings and SEO?

Another design solution may be to give the header a transparent background and position it over the featured image. This way it still emphasizes the message and call to action but reduces the visibility of the navigation.

4

Hey Joel,

No worries! If that’s the case then you may need to use another way to achieve this. You can use a 3rd party plugin or custom code your fixed header and disable ours. Then use our No Header/Footer for your homepage that way the header won’t be on the markup. :slight_smile:

Using display: none won’t work since the main header will be hidden. The fixed header depends on the positioning of the main header.

Ben

5

Ben! I’m playing with some options now. Thank you!

6

Hey Joel,

No worries! Let us know if you find/need anything further! :slight_smile:

Ben