How can I make my website's top bar remain fixed during scrolling?

gaelrt
Tourist
15 0 1

Hello everyone,

 

I'm having a little problem with my Shopify store. Indeed, I would like the top part of the website (announcement bar and menu) to be fixed and remain displayed even when the user scrolls down, whether on mobile or desktop. Currently, it's only visible when the user goes up.

 

Here's my site address: https://solki.fr/

 

I'd like it to work like on https://www.respire.co/

 

Do you know how I can do this?

 

Many thanks for your help,


Have a nice day,
Gaël

Reply 1 (1)

YOD_Solutions
Shopify Partner
203 22 29

Add the following at the bottom of the "base.css" file in the assets folder. Please note that this works if you always have the announcement bar at the top.

 

sticky-header{
   position: fixed;
   width: 100%;
   top: 39px;
}
#MainContent{
  margin-top: 57px;
}

 

Founder @ JsRates: Custom Shipping Rates
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more about JsRates visit the JsRates home page or JsRates documentation
- Find JsRates on Shopify app store