How do I make Debut Theme navigation bar sticky?

New Member
1 0 0

hi guys, sorry if this is wrong place to ask this question and sorry for my bad english too.

i want to add a sticky navigation bar to my debut theme, what code can i add to do it please? when i scroll down i want it to stay visible on screen on mobile and also computer, please...

can somebody help me or share some code that i can paste in theme?

thanks very much!

Shopify Partner
239 56 70

Hi there,
Jack from OpenThinking here!

add the following code at the very bottom of your theme.scss.liquid file:

.site-header { position:fixed; top:0; left:0; width:100%; z-index:999; }

let me know if this works for your. If yes; accept my answer and give me thumbs up! Thank you.

⚡️ Get our [Shopify Themes]: Lightning-fast, eye-catching, highly converting, SEO-optimised, Minimal.
⚡️ Struggling with CODE? You need a Shopify expert to help you with your theme! [Get a free quote]


I have coded a professional, highly tested solution for this if you'd like to try.

You can download/install it for free under 1 minute, just click here to read the tutorial.

Besides that you also have options to turn it on/off at the customize page, even to allow it only on desktop or mobile depending on your needs.

Kind regards,

◦ Product page slider & thumbnails with swiping for free themes: Minimal | Debut | Brooklyn | Supply
◦ Replace apps with simple copy/paste code snippets. Examples clicking here.