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

How to add a shadow under the words "Unleash the full..."?

Solved

How to add a shadow under the words "Unleash the full..."?

empiricalarby
Trailblazer
230 1 53

https://empiricalwater.com/

 

I would like to make the words "Unleash the full..." pop out more over the images. I do not want to change the opacity of the images to accomplish this. How do I add a large blurry shadow to make the text pop out more?

 

Thanks

Accepted Solution (1)

BSS-Commerce
Shopify Partner
3478 465 561

This is an accepted solution.

Hi @empiricalarby,

To make the text "Unleash The Full..." stand out more, you can create a shadow behind the text. Open the base.css file in the code folder and add the following line of code:

h2.banner__heading.h1 {
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.9);
}

Note: To open the base.css file, visit the admin page, then select Sale channel and select Online Store. In the Online store page, select Edit code and search for the base.css file in the search bar. Paste the above line of code into the last part of the base.css file.

Hope it helps @empiricalarby 

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


Product Labels by BSS | B2B Solution & Custom Pricing


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

Reply 1 (1)

BSS-Commerce
Shopify Partner
3478 465 561

This is an accepted solution.

Hi @empiricalarby,

To make the text "Unleash The Full..." stand out more, you can create a shadow behind the text. Open the base.css file in the code folder and add the following line of code:

h2.banner__heading.h1 {
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.9);
}

Note: To open the base.css file, visit the admin page, then select Sale channel and select Online Store. In the Online store page, select Edit code and search for the base.css file in the search bar. Paste the above line of code into the last part of the base.css file.

Hope it helps @empiricalarby 

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


Product Labels by BSS | B2B Solution & Custom Pricing


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency