How to change mobile header dropdown menu transparency (broadcast theme)

TimTakeTwo
Excursionist
28 0 6

Hello,

 

Is there a way to make the header transparency more darker so the menu text items are more legible?

 

TimTakeTwo_0-1709081012903.png

 

Thank you in advance.

 

Replies 4 (4)

NerdCurator
Shopify Partner
378 70 103

@TimTakeTwoCan you please provide the URL of your store and if it is password protected please share the password too. Thanks

Believes in delivering optimizing web solutions | Shopify Partner | Working as a web developer for last 8+ years.
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email me: info@nerdcurator.com

NerdCurator
Shopify Partner
378 70 103

@TimTakeTwo  You need to add this code in the theme files. For which you need to go to Online Store > Actions (Active theme) > Edit Code > Assets, under assets add the code at the bottom of theme.css file.

 

.drawer__inner{
  background-color:#000;
}

 

Believes in delivering optimizing web solutions | Shopify Partner | Working as a web developer for last 8+ years.
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email me: info@nerdcurator.com

PageFly-Richard
Shopify Partner
4226 957 1603

Hi @TimTakeTwo 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
@media screen and (max-width: 767px){

.drawer__inner {
    background: rgba(0,0,0,0.8) !important;
}
}
</style>

If its not dark enough, you can increase 0.9 to keep the transparent.

PageFlyRichard_0-1709084650805.png

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

ZenoPageBuilder
Shopify Partner
1052 203 217

Hello @TimTakeTwo 👋

In Shopify Admin, you can go to Edit theme code, open file theme.css and add this code at the bottom

.drawer__underlay {
background-color: #000000CC !important;
}

The result

Screenshot 2024-02-28 at 09.20.37.png

Hope that helps!

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com