Shopify themes, liquid, logos, and UX
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 |
---|---|
153 | |
96 | |
71 | |
62 | |
51 |
Connect your PayPal account to allow your customers to checkout using the PayPal gateway a...
ByYour online store speed can enhance your store’s discoverability, boost conversion rates a...
ByShopping is at our fingertips with mobile devices. Is your theme optimized to be user-frie...
By