Venture theme - make menu bar background opaque

Solved
Highlighted
New Member
2 0 1

I've tried several suggestions of code that I've found in past topics but none solve the issue. I'd like to make the background of the menu bar opaque when a user scrolls the page. I've made the code additions to the theme.css.liquid file so unless I'm adding code to the incorrect file, I'm not sure what I'm doing wrong. 

1 Like
Highlighted
Shopify Partner
7469 1032 2593

Hello, @m_houser 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
Astronaut
1082 173 211

Hello,

Thank you for your question. 

Please share your store URL, page URL and also password (if your store has one), I'll help you out to the best of my ability.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
New Member
2 0 1
0 Likes
Highlighted
Astronaut
1082 173 211

Can you send me a screenshot of what exactly you'd like to be opaque, please?

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
Astronaut
1082 173 211

This is an accepted solution.

dantepw_0-1597817008958.png


1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:

.sticky--open #StickyNav{
    background: rgba(255,255,255, 1) !important;
}


I believe this is what you want, right?
I made the background white, but you can adjust the transparency just changing the number to anything between 0 and 1 like, for example:  0.5


Let me know if it's as you wish plz

 

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
Shopify Partner
7469 1032 2593

Hello, @m_houser 

Thanks for info

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.sticky--active nav {
    background: #fff;
}

 this much better your ux theme

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes