Tearing my hair out trying to add an image background to the nav header - help!

[Rob_H1]

Hey There,

I'm really hoping i can get some advice here, i am using the "Material" theme by roarthemes and I've been trying to add an image background to the header for 5 hours now, it's driving me crazy.  Would anyone have any advice or code that i could use in order to add a background image to the header above the nav bar ?  See attached,  where i was hoping to add the background image (headbg.jpg)

https://rt-material.myshopify.com/ 

[Denishamakwana]

Hi, here I attached one screenshot for header background  Please confirm look for that .

Thank you.

[Rob_H1]

Denishamakwana  you are a genius!  that is exactly what im looking to do.  Can you give me the code you used to get that image in the background of the header please.  You're a star!

[Denishamakwana]

First of all  add image in admin side  which you want to header background.

then see cdn path for that particular image.

then add below css in bottom of assets/rt.style.scss.css file

#header_nav {

      background-image: url(//cdn.shopify.com/s/files/1/0885/9170/t/8/assets/slide_image_2.jpg?v=872245961168612101); (here give new cdn path)

      background-position: top; ( position change as per requirement)

}

Thank you.

[Rob_H1]

Thanks Denishamakwana for your swift replies, much appreciated.

I added that code in to the assets/rt.style.scss.css file but it broke the site unfortunately.  It seems that everything above the slider where the nav bar is broke when i put that code in.  Do you have any advice for me ?  How did you get the image background into the nav bar like the picture you posted earlier that was perfect !

here is the link to the background image i would like to use in the nav header area like you did earlier

https://cdn.shopify.com/s/files/1/0614/4681/5953/files/headbg.jpg?v=1647394233

See attached 

[Denishamakwana · Accepted solution]

First of all remove  "(here give new cdn path )"  in css file .

Thank you.

[Rob_H1]

That worked, THANK YOU so very much !!!  It is perfect, exactly what i needed.

You have been extremely helpful and solved my issue very professionally.  Thanks again Denishamakwana REALLY appreciate your helpful advice and instruction

REgards

Rob

This is how the header looks now, just like i wanted it !

[Denishamakwana · Accepted solution]

Also remove (position change as  per requirement) 

Because it is just information not a code

Thank you.

[Denishamakwana]

it's my pleasure to help you .

in future any query regarding any customization of your site please contact me.

Thank you.

[Rob_H1]

I certainly will do that.  Thanks again