Remove background box from behind text on a page Dawn Theme

TamaraM
Visitor
2 0 0

I have built a few landing page templates in my store, via the theme editor, and need to make the solid white background behind the text in this image shown more translucent so part of the image appears but text is still legible.

Have tried multiple options from previous suggestions of reducing transparency percentage but my code doesn't have this option. It's either '1' white is solid white, or off (then the text isn't visible/clear).

I'm on Dawn 12.0. Any suggestions?

 

Screenshot 2024-04-16 at 1.41.50 PM.png

Replies 3 (3)

theycallmemakka
Shopify Partner
1501 338 362

Hi @TamaraM ,

 

You can hide this by unchecking "Show container on desktop" on the image banner section.

 

theycallmemakka_1-1713242981838.png

 

Buy me a Coffee


Enjoy Shopify for $1. Sign up now


For quick response - Message Me


Ping me at: theycallmemakka@gmail.com

TamaraM
Visitor
2 0 0

Thanks so much for the reply. Will save this for future use, but I'm hoping to make it more translucent (shadow box) rather than disappear completely as the text is hard to read over the image. Realise my original message was mis-written.

 

magenest
Shopify Partner
162 10 19

Hi @TamaraM, you can edit your color code so it becomes more translucent. Here is how:
Go to Online Store > Theme > Customize > Image Banner > Custom CSS and type in this code

.banner__box {
background: rgba(0, 0, 0, 0.2);
}"

You can customize the RGBA color code to fit your preference. The A is Alpha, which is a number between 0.0 (fully transparent) and 1.0 (fully opaque)
 Hope this helps and have a nice day

Magenest - One-stop Digital Solution Provider
- Don’t forget to drop a thumbs-up and Mark it as a Solution if you find our response useful
- Elevate your online business with our Shopify experts and professional designers