How to get a background image on my site

[cecepee]

New question.

I was thinking to put a background picture on my site instead of just the white color background.
In plain HTML web sites i used to fix that with the body tag.

I tried to do the same in the css file but its not working.

Can someone tell me how i must do to get a background image on my presta website?

Best regards
Peter

[cecepee]

No one?

I thought that i have seen a few shops where it seems to be background images.

I would like to have a X-mas kind of wallpaper as a background. but cant seem to get it to work.

If it can be done. where and what kind of code should i put, wanted to use a gif as background.

Thanx in advance.
Peter

[cor3ys]

Hi cecepee

you do this in your theme CSS about line 16 put some thing like this

background: url(../img/canvastile_bg1.jpg) repeat-x scroll 0 0

just put you image name in place of canvastile_bg1.jpg and upload it to your image folder in your theme

[cecepee]

Thanx for your tip.
I have tried for a while now but it doesn't seem to work.
Whenever i try to edit that file i end up with a very ugly site, but still no background image.
An example would have been great, but maybe its not supported in this shop.
Will ask Google a few more times, other wise i will just have to put my x-mas decoration in a table frame instead.

Anyway, thanx for your tip.

Best regards
Peter

[cor3ys]

the example i gave you is what i am using in my site at www.vibrantpuzzles.co.uk

[cor3ys]

The actual code from my CSS

body {
   background: #E6E8EB url(../img/canvastile_bg1.jpg) repeat-x scroll 0 0;
   font-size: 11px;
   font-family: Verdana, Arial, Helvetica, Sans-Serif;
   color: black;
   text-align:center;

[cecepee]

Thank you very much.

This is what i need, an example for dummy's. :-)

So if i have understand this right, the file you have edited is
/themes/prestashop/css/global.css ?

/themes/prestashop/img/canvastile_bg1.jpg

because when i try, i don't see any bg-image, and instead the text and stuff gets changed to big size and altered locations.
but i will try again, your example.

Thanks, really.
Peter

[cor3ys]

yes adjust the global.css line 16

the bg image is my own image change it for your own image and upload it to the folder.

change the font-size to what you want, like i said it is a snippet from my code...

[LucieV]

Never mind, I got it working.

Thanks !

[Pinkloveshy]

Hi

How did you get this working please. I have tried the above and had no success
Current code line 16 Global CSS in themes CSS

body {
background-color: #DEF7FE;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, Sans-Serif;
color: #000099;
text-align:center;

New code pointing to my background JPEG which I saved in IMG and all I got was a white background.

body {
background: url(../img/bigwave_bg.jpg) repeat-x scroll 0 0;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, Sans-Serif;
color: black;
text-align:center;

Any thoughts?

Many thanks

Pinkloveshy

[razaro]

I just added quotes and it works.

background:url("../img/bigwave_bg.jpg") repeat fixed 0 0 #FAFAFA;

But it doesn't look good on 1680x1050.

Cheack PM for image.

[Pinkloveshy]

Thanks Razaro

Really appreciate your help.
what does this bit mean/do..........repeat fixed 0 0 #FAFAFA;
Any ideas how I can get a nice image down the sides and leave a solid colour up the middle?

Many thanks

Gillian
Pinkloveshy

[razaro]

Sorry i was trying something with background and didn't deleted that part of code.
Here is explanation for background property
http://www.w3schools.com/css/pr_background.asp

You need to make image example 1280px wide with 980px rectangle in middle and graphic/image at both sides.
Height of image could be 500 - 1000px but to look good you must make it seamless, so when it repeats on y axis
you have nice transition between two images.
Then you put code similar to this

body { background: url("../img/bg.jpg") repeat-y scroll center top white;} 

Good example here with image and css

background:url("../images/structure/body_bg.jpg") repeat-y scroll center top #EBEBEB;

[Pinkloveshy]

Brilliant your a star. Thanks ever so much for your help
Regards
Gillian
Pinkloveshy

[armadillo]

Hi, i want to add a background just on authentication.tpl, i find authentication.css but which code i have to add for background image?