Question:
[Hello, who knows how to set the default header to transparent in Wix Studio? (Background at 0 % does not bring any change).
Kind regards
Anja]
Change the page’s background to the same one as your first section’s background or pin the header .
Unfortunately, it doesn’t work for me. The background of the header always remains white 
I guess you’re not clearly understand the instructions. I’ve made a video for you ,
First method:
is go to the layers tab in the left menu of Wix studio and change
the background color of the page .
You said it remains white because the whole page background is set to white by default.
Second Method:
If you’re header is pinned on top of the page, you can pin the header by changing position in the Inspector (Right side of Wix studio)
If you’re still confusing, here is a video how to do it, I hope it’ll fix your problem.!
Video Link
Hello,
Thank you very much for your efforts!
Unfortunately, it still doesn’t work. I suspect that I have overlooked some setting.
I did it exactly as you described in the text.
Unfortunately, I couldn’t open the video.
I would like the header to look as transparent as in the WIX sample template.
You can see my settings in the PDF. I have set the background in dark to 0 % and also tried it in white at 0 %. Still does not work.
What could be wrong?
Another question: Can I copy a header from a master template and drag it over to me?
Kind regards
Anja
I see. You should check first section’s background and padding if you’re using the background as a separated picture fix it to 0px/% and align to top or check if header is pinned to page or not.
If you’re struggling with the current header, I recommend you make a new header and set it global. Sometimes, the default headers are buggy.
You can copy a header from another Wix template, but you need to manually customize it for responsiveness or style.
1 Like
Thank you very much, Mike. Unfortunately, I still didn’t make it.
I can’t copy over a header from another design template either. Other sections yes, but not a header.
Kind regards
Anja
You should create your own one Anja. delete the default header first and set your new header as default, so it’ll appear across your site.
1 Like
I tried that too. The new header also shows a white background despite 100% color. And I can’t pin the new one either.
Thanks anyway, Mike!
Hello Mike,
I have made it. I am so happy. Thank you very much for your tip to delete the header and create a new one. Best regards, Anja
Hello Mike,
I have finally made it. I am so happy. Thank you so much for your tips and your great help. Best regards, Anja
Glad you’ve Made it. Keep Going sir!!!
A follow-up question: is there a way to animate header background opacity while scrolling? So that at first the opacity is 0, and after scrolling (and delay or distance) it goes up to 1. I’m unable to achieve it with the default header, haven’t actually tried it with custom-built header yet.
Hi Vunts,
If you’re trying to add color transition for Wix Studi default header, it’s available in the right menu the inspector, you can change the header’s color and make the opacity of header’s color on scroll under the scroll effects .
Hi @Anja_Schumacher - I notice the solution here is for a colour background only.
If you want your header to be transparent with the hero image shown underneath (similar to the template example you showed), try the following. The order seems to really matter, as does ensuring the right layer is selected, before completing the next step, so try and follow the steps as precisely as possible.
- Select your header (with a mouse-click).
- Open the ‘Inspector’ (the right toolbar) and make note of the height of you header (let’s use 50px for this example).
- Create a new section under your header using the ‘Add Section’ button (appears when you hover on the centre of the bottom border of your header.
- Open the ‘Layers’ panel on the left toolbar and ensure the newly added ‘Section’ is selected - this will be your hero image section).
- Open the ‘Inspector’ (right toolbar) and set the height dimensions of the section to your desired height (for this example let’s say 500px), and under ‘Responsive behavior’ ensure that ‘Apply max width’ is NOT selected (you’ll likely need to turn this off).
- With the section still selected, open the ‘Add Elements’ panel on the left toolbar, then go to ‘Quick Add’ and add a ‘Container’.
- Open the ‘Layers’ panel on the left toolbar and ensure the newly added ‘Container’ is selected.
- Open the ‘Inspector’ (right toolbar) and manually adjust the dimensions of the container to the following (IMPORTANT: do not stretch the container!):
- X = 0px (this is a fixed value that ensures it is aligned to the left edge of the browser).
- Y = -50px (edit this value to your needs - it is a negative value to the height of your header, so in this example -50px).
- W = 1265px (this is a fixed value and is the pixel equivalent of 100% width)
- H = 550px (edit this value to your needs - it is your desired hero section height + your header height, so in this example, 500px + 50px = 550px).
- With the ‘Container’ still selected, open the ‘Add Elements’ panel on the left toolbar, then go to ‘Quick Add’ and add an ‘Image’.
- Select the image with a mouse-click and ‘Stretch’ it, using the button in the top right-hand corner of the image.
- Change the image to your desired background image.
Hope this helps 
