Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hey team,
Wanting to make header transparent on every product page for mobile and desktop. Home page is currently transparent but product pages are not.
Any help would be appreciated!
Hi @Nato0201 ,
Please follow these steps:
1. Please navigate to Online store => Themes => Edit code
2. Search for the file "base.css"
3. Add this code at the end of the file and save
@media screen and (min-width: 1025px) {
.header-nav-hamburger:not(.header-hamburger--transparent) {
background: transparent!important;
}
}
This is the result
Hope this will helps
Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges: Get more sales with striking labels, badges, and banners from our 10,000+ available templates.
BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now
Hey! Hasn't seemed to work. Is it meant for base.css?
Apologies! the header it self is transparent which is great! but It's still it's own block so I can't have a photo go behind it when the page loads if that makes sense (see attached)