Background Image Please

Please guys tell me how to add a background image to the site

Please edit: /templates/gk_rockwall/css/override.css and add at its end:

Code: Select all

#gkPageContentWrap {background: #FFF url('../img/backgroundimage.jpg') 50% 0;}


Place image file in /templates/gk_rockwall/img/ (backgroundimage.jpg), that is 1920px wide and long as You like. It will be centered horizontally.

Remember to enable "CSS override" in template settings - advanced section.

It doesn't work

Helllo?

Could You post an URL to your site, where the code is added?

I sent you private message.

There is no bg2.jpg file in folder:
/templates/gk_rockwall/backgrounds/

Also, You should not create additional folders in root of template folder, use already existing /img/ instead, so You should place background file in:
/templates/gk_rockwall/img/backgrounds/
and in css also use:

Code: Select all

#gkPageContentWrap {background: #FFF url('../img/backgrounds/bg2.jpg') 50% 0;}


what are you talking about there is not " img" folder in the template . Also the reason you did not see the image is because i took it off because it did not work. Go look now I placed bg1.jpg image inside the images folder already in the template and use your code like that

Code: Select all

#gkPageContentWrap {background: #FFF url('../images/bg1.jpg') 50% 0;}

and nothing happens

what are you talking about there is not " img" folder in the template . Also the reason you did not see the image is because i took it off because it did not work. Go look now I placed bg1.jpg image inside the images folder already in the template and use your code like that

Code: Select all

#gkPageContentWrap {background: #FFF url('../images/bg1.jpg') 50% 0;}

and nothing happens

I just checked it in firefox it works But I can't see it in chrom

It is there - in Chrome.
Clear cache or force reload with ctrl+r - it helps sometimes.

It works Thanks. Can you help me make it no-schroll? Also it;s seems to repeat.

Code: Select all

#gkPageContentWrap {background: #FFF url('../images/bg1.jpg') 50% 0 no-repeat;}


adding no-repeat makes it no repeat

Code: Select all

#gkPageContentWrap {background: #FFF url('../images/bg1.jpg') 50% 0 no-repeat;
background-position:fixed;}


adding aditional background-position: fixed makes it no scroll.

the no-repeat works but the no-scroll doesn't

Code: Select all

#gkPageContentWrap {background: #FFF url('../images/bg1.jpg') 50% 0 no-repeat;
background-attachment: fixed;}


sorry, my mistake.

Thanks. It works.