Sticky/Fixed Header and Navigation for Debut Theme

New Member
1 0 0

I tried to do this and it really works.

But the dropdown(when you add menu under menu haha), the search and the three-bar(for mobile view) are not working.

0 Likes
Tourist
8 0 1

Hi Sean

Thanks for sharing this.

Is there a way to just have the announcement bar visible at all times and not the header/menu bar when scrolling down the home page?

Thanks!

0 Likes
Tourist
5 0 1

Hi SeanP

I am sure you must be frustrated with all of these tech support questions - so I completely understand if you don't reply!

I am using Debut theme with the announcement bar enabled. I have implemented Option I and it does work... but down by screen "jumps and jiggles" when it loads. Any idea what I am doing wrong?

Thanks

Kerry

 

 

0 Likes
New Member
1 0 1

Here's the fix to the Header covering the contents of the Body of the page.

You need to increase the space between the Header and the Body of the page. I found that this can be adjusted by changing the values in the code above (see my example below in bold) which had acceptable results for my site. Note that the top value changes the desktop version of the theme and the value below changes the mobile version.

 

#PageContainer {
padding-top: 130px;
}

@media screen and (max-width: 749px) {
#PageContainer {
padding-top: 200px;

 

 

New Member
3 0 0

thanks for posting @MinusH2O . I changed the values you gave to the following to fix the header on my page. 

 

#PageContainer {
padding-top: 201px;
}

@media screen and (max-width: 749px) {
#PageContainer {
padding-top: 301px;
}
}

0 Likes
Excursionist
18 2 1

I am having the same problem with the announcement bar pinned to the top (good thing) but the navigation bar is not moving up to fill the space.  Did you find a solution?

0 Likes
Excursionist
18 2 1

I am having the same problem with the announcement bar scrolling out of view (good thing) but the navigation bar is not moving up to fill the space.  Did you find a solution?

0 Likes
New Member
3 0 0

The sticky header is working  well for me in the desktop view, but no on mobile... Does anyone have any tips on how to fix this? I am using the debut theme. 

0 Likes
New Member
1 0 0

Hi! I have a question about your sticky navigation how did you make it where it is white completely? Mine follows the user but it looks like this:

 

9A5A85F6-334A-441B-8FB5-22BFF5E156A3.jpeg

0 Likes
New Member
1 0 0

This worked for me!!! Extending a big thanks, I've been troubleshooting this issue for days!

0 Likes