Replace Header and Footer Background with Image

[avenue5000]

Hey everyone, I'm pretty illiterate with code in Shopify, and I'm having trouble adding a background image for the header and footer of the site.  The theme I'm using is Venture.  

I made this image to show what I want the end result to be, right now they are just black.

I'm not sure if the floating navigation (home, products, about) is a different part, and you cant have a seamless transition in the image, but I'm really hoping you can.  When you scroll down, the image also has to attach to the floating nav.  

If anyone can help me out here, or give there 2 cents, I would greatly appreciate it!

Thanks in advance,

Holden

[oscprofessional · Accepted solution]

Hello @avenue5000,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

.site-header {
 background-image:url({{ 'image.jpg' | asset_url }});
}
#StickyBar {
background-image:url({{ 'image.jpg' | asset_url }});
}
#shopify-section-footer {
background-image:url({{ 'image.jpg' | asset_url }});
}

[edmundo11]

Hi I don't have the theme.scss option in my assets so i'm sure where i should be placing the script. could you assist?

[netguy]

Hi I don't have the theme.scss option in my assets either

[MkdMaya]

Hello ,

is it  normal that i 've tried many ways to charge an image in the header but it doesn't load?
I tried your solution , I tried others and it is always white ,

1/ when i put a color instead of transparent as below , the header change correctly to red 

header.site-header {
background: red ;
}

but when i put 
header.site-header {
background-image: url("1.jpg");
background: transparent;
}

or 

header.site-header {
background-image: url("1.jpg");
}

nothing happens only white.
Could you please help?
Thanks,
Maya