Sticky header

Hi

How do I make the header permanently sticky, it seems to be mainly sticky but at first scroll it disappears briefly then becomes sticky.

Thank you.

Hi @gcneal,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

nav#site-navigation {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    right: 0;
    opacity: 1;
    visibility: visible;
}

Best Regards,
Movin

Same issue here.

I can confirm that this solution does not work.

Thank you Movin

Seems to work for me.

redinfluence what issue do you have?

@gcneal You are most welcome here :slight_smile:

@redinfluence

I can confirm that this solution does not work.

Could you please share me the page URL from your site where it’s not working correctly so that i can troubleshoot it?

That bit of code did the trick for me.

@vsglenn You are always welcome here :slight_smile:

I have “Coming Soon” mode enabled so the website visitors can’t access the online eCommerce store yet.

I can grant you admin access so you can login and see the store/issue.

@redinfluence

Ok then could you please share me the password privately by checking the option “Set as private reply” when replying here so that i can troubleshoot it?

I put the code in the specified section, but its not working.

My goal is to get the header (logo, top navigation, nav bar, stick to the top, so that when you scroll down, the header stays at the top and does not follow the scroll down the page. The header (logo, navbar etc) should only appear if you scroll to the very TOP of the page.

http://www.kratom-kings.com/wp-admin
U: [email protected]
P: iAD2vRl20#GZl!d8bGg$gdBF

@redinfluence Thank you for sharing the site details but it didn’t work for me.

My goal is to get the header (logo, top navigation, nav bar, stick to the top, so that when you scroll down, the header stays at the top and does not follow the scroll down the page. The header (logo, navbar etc) should only appear if you scroll to the very TOP of the page.

According to your above stated description it seems that you do not want the header fixed or sticky which you can achieve by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

nav#site-navigation {
    position: static;
}