Changing opacity (Brooklyn Theme)

New Member
1 0 0

Hello, 

In my current website I have encountered the problem that the header and main body of my home page are both the same color. I do not have a slideshow in the beginning of my home page so it is not letting me change the opacity as it would if there was a slideshow. My question is can anyone possibly help guide me towards either changing the opacity of the header, or changing the opacity of the featured product section, because at the current moment they are both the same color, and I would like there to be a clear distinction between the header and the main body of the home page. Just to clarify, I am not talking about the Announcement bar at the very top of the page but rather the header bar where the logo and buttons are displayed.

 

Thank you very much, 

Ethan 

0 Likes
Shopify Expert
2461 414 519

HI @EthanMM 

Send me your store url 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Shopify Partner
1125 90 137

Please Share a Store url to better Assist.

Thanks & Regards
Perennial Solution

Problem Solved?✔️Like and Accept the solution that can help others.
Need any help with theme customization or design? Hire us
Email: infoperennialsolution@gmail.com
Skype: infoperennialsolution
0 Likes

Hi Ethan,

 

First, disable the 'Enable transparent header on the homepage' option in your theme settings for the header.

 

Next, in your timber.scss.liquid file (Online store > Themes > Actions > Edit code > Assets > timber.scss.liquid) look for the following code:

.site-header {
  background-color: $colorBody;

Replace $colorBody; with the color you would like. You can use a color name e.g. 'red', or a hex code e.g. '#ff0000', or rgb e.g. rgba(255, 0, 0, 1). With rgba you can adjust the opacity by replacing the final number (1) with a value between 1 and 0 - e.g. '0.5'.

 

Regards,

Tom

Shopify Partner & Developer
If it's a problem you can't solve the job is not too small - get in touch
littleventures.net
contact@littleventures.net

Print or download a PDF catalog for your store in minutes - Shop-2-Doc
0 Likes