Sticky/Fixed Header and Navigation for Minimal Theme

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
Trailblazer
139 11 15

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
New Member
2 0 0

Thanks!  Looks awesome!

0 Likes
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
Trailblazer
139 11 15

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