Making Header Bar 2 Transparent

Support
#1

Hi there, I have a deader for my Pro site setup, but for some reason, I can’t make the third bar transparent to show the header background image. Please could you help me take a look?

#2

Hey @jasksks,

Upon checking, I see the third bar showing the background image (see secure note). Is this fixed? If not, would you mind providing more details and screenshots?

Thanks.

#3

Hi there, thank you for your kind attention. I have a background image set for Bar 2 which is there you’re inspecting. But I’ve also set Bar 3 to be transparent, which is where my social icons are at, and for some reason it’s still displaying a white background. I can’t figure out why. I would like it to display the same background image throughout.

#4

Hi There,

The white background is from the body. Your bar is currently transparent now:

You can test by changing the body background color.

Regards!

#5

Hi sorry, but I’ve checked and rechecked and all background colours are set to transparent, including the page. By body section, could you please help clarify. Is it within the Header editor?

Thank you.

#6

Hi @jasksks

I’ve tried to check your website now, but this is what I got so far:

Regarding the body background color, it’s located there at (Theme > Options > Layout and Design > Background Options > Background color).

Thanks.

#7

Hi, thanks for your help. I’ve actually already made the site background transparent beforehand, so I’m really not sure why my header bar is still showing white.

Please could someone help me take a look?

#8

Hi There,

Please try adding the background image to your site and you will see that bar is transparent:

Regards

#9

Hi yes, but as above, I guess I needed to phrase my query better. I would like Bar 3 to be transparent and reflect the background image as the bar above it. I can’t seem to get around it without having to create a new container and having all the social elements misaligned as a result.

#10

Hello There,

Could you please unblock us or at least temporarily disable your security plugin so that we can check again your header?

Thank you in advance.

#11

Hi, sincerest apologies, I’ve disabled my security plugin now.

#12

Hi There,

Please add the margin-top: -4rem; to the element CSS of your bar #3:

Hope it helps :slight_smile:

1 Like
#13

Thank you very much for your help! It’s perfect! Really appreciate the kind support!

#14

You’re welcome.

#15

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.