Sticky/Fixed Header and Navigation for Minimal Theme

Highlighted
New Member
2 0 0

Hello, just started my online shop, Simply Leafy.

Does anyone know how to get the header, with logo, cart, sign in, top menu links etc. to be fixed with the Minimal theme? I really like this theme but would like a fixed sticky header as well.  

Thanks,

Jason

0 Likes
Highlighted
Shopify Partner
270 26 42

Hi @simplyleafy,
You can use these CSS styles to make that changes

.header-bar {
    position: fixed;
    z-index: 999;
    width: 100%;
}
header.site-header {
    padding-top: 60px;
}

On your theme go to Edit code, then at the sidebar go to Assets -> theme.scss.liquid
and paste the code at the end of the file.

Let's make the best store!
Contact us at: thepremierstores@gmail.com
0 Likes
Highlighted
New Member
2 0 0

Thanks!  Looks awesome!

0 Likes
Highlighted
New Member
6 0 0

I tried the code by copy pasting it at the end of theme.scss.liquid it but its not working for my simple theme. Any thoughts?

0 Likes
Highlighted
Shopify Partner
270 26 42

Hi, @navoms:

Simple theme requires different styles, this is how it should look:
header.jpg

The sticky will include your logo, we can make a better header but we will need to edit some liquid code.

Let's make the best store!
Contact us at: thepremierstores@gmail.com
0 Likes
Highlighted
New Member
1 0 0

hello,

tried this fix. but for some reason only the announcement bar search and cart has fixed position. but logo and menu and line below still scroll.

any ideas? could be and update on the theme.

0 Likes
Highlighted
Tourist
13 0 1

would also interest me

0 Likes
Highlighted
New Member
2 0 0

 

Same problem for me...  Just the announcement bar sticks and the rest of the header doesn't stick.  Any ideas would be much appreciated.

 

0 Likes
Highlighted
New Member
2 0 0

Also needing assistance.  Currently trying to include my logo and navigation into the sticky header. Succeeded in making the header sticky but I can't yet add the navigation and logo.

0 Likes