ecs_cares Posted November 5, 2019 Share Posted November 5, 2019 Hi! I was wondering if anyone can help me come up with a code to change my navigation bar colours to be different on my products page. It is currently transparent and gets lost when scrolling. My other question is how to code my logo and navigation bar to be fixed but get smaller upon scrolling. The template I am using is Brine. Link to comment
tuanphan Posted November 6, 2019 Share Posted November 6, 2019 @ecs_cares 1. Add to Home > Design > Custom CSS If it doesn't work, please share product page url to check code. .collection-type-products.view-item header.Header { background: #f1f2f3 !important; } 2. Fixed .Header.Header--top { position: fixed; top: 0; left: 0; right: 0; z-index: 999; } 3. get smaller upon scrolling. You need to use JavaScript, a bit complicated. Wait for someone to help you. (or contact me, in signature (not free)) Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
ecs_cares Posted November 6, 2019 Author Share Posted November 6, 2019 3 hours ago, tuanphan said: @ecs_cares 1. Add to Home > Design > Custom CSS If it doesn't work, please share product page url to check code. .collection-type-products.view-item header.Header { background: #f1f2f3 !important; } 2. Fixed .Header.Header--top { position: fixed; top: 0; left: 0; right: 0; z-index: 999; } 3. get smaller upon scrolling. You need to use JavaScript, a bit complicated. Wait for someone to help you. (or contact me, in signature (not free)) Okay, thank you so much!! 🙂 Link to comment
NickBuild2 Posted November 25, 2020 Share Posted November 25, 2020 Hi @tuanphan was wondering if you could help. I need transparent header on all pages except the blog page. I've tried targeting the page with #collection but it's not working. body#collection-5fb45b66870d86070fc87c95 header#header { background-color: #000 !important; } Link to comment
tuanphan Posted December 2, 2020 Share Posted December 2, 2020 On 11/25/2020 at 8:22 AM, NickBuild2 said: Hi @tuanphan was wondering if you could help. I need transparent header on all pages except the blog page. I've tried targeting the page with #collection but it's not working. body#collection-5fb45b66870d86070fc87c95 header#header { background-color: #000 !important; } Can you share site url? We can help easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
toripintar Posted February 18, 2021 Share Posted February 18, 2021 Hi @tuanphan, I am similarly trying to turn off the transparency on a single page, my new Member Area sales page. This is the url: goldfish-grape-wehm.squarespace.com. The page is https://www.mountainprojectmt.com/member-areas-1 Thank you so much! Tori Link to comment
tuanphan Posted February 21, 2021 Share Posted February 21, 2021 On 2/19/2021 at 4:18 AM, toripintar said: Hi @tuanphan, I am similarly trying to turn off the transparency on a single page, my new Member Area sales page. This is the url: goldfish-grape-wehm.squarespace.com. The page is https://www.mountainprojectmt.com/member-areas-1 Thank you so much! Tori You want to change navigation items color or?? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
toripintar Posted February 23, 2021 Share Posted February 23, 2021 On 2/21/2021 at 2:27 AM, tuanphan said: You want to change navigation items color or?? I want to make the main navigation menu a color on one page only. Link to comment
tuanphan Posted March 5, 2021 Share Posted March 5, 2021 On 2/24/2021 at 12:05 AM, toripintar said: I want to make the main navigation menu a color on one page only. Add to Page Header <style> .header-nav * { color: black !important; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
toripintar Posted March 19, 2021 Share Posted March 19, 2021 Thank so much for all the help everyone. In case anyone else is in this situation, here is the code that allowed me to make my header bar not transparent and choose the color on a single page. Add to page header <style> .header-announcement-bar-wrapper { background-color: #282D30; } Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment