Access a community of over 900,000 Shopify Merchants and Partners and engage in meaningful conversations with your peers.
So heres what it looks like before I made it a sticky header:
Here's what it looks like now:
The code I used in the theme.scss file was:
header.site-header {
position: fixed;
z-index: 999;
width: 100%;
}
Im not sure what I did wrong. I mean it is sticky but the entirety of it is not filled in with color.
Here's the url: https://minimal-design-james.myshopify.com/
Here's the password: FoxHound422
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.
That makes my announcement bar a sticky header instead of the line with the home, our menu, and about us nav links. I want the nav links line to be a sticky header. Should i just try and have the whole section a sticky header? When i scroll down only the announcement bar with the search comes with it.
User | RANK |
---|---|
210 | |
111 | |
88 | |
56 | |
45 |