Chat Room Article Base Facebook Page Twitter RSS Feed
Welcome, Guest. Please login or register.
Did you miss your activation email?
May 22, 2012, 11:53:33 PM

Login with username, password and session length
Search:     Advanced search
The E-commerce forum, the best place for advice for your Small Business.
12787 Posts in 1519 Topics by 6451 Members
Latest Member: jackmiller
* Home Help Search Login Register
+  E-commerce forum
|-+  E-commerce
| |-+  Website development
| | |-+  Background image in zen-cart
« previous next »
Pages: [1] Print
Author Topic: Background image in zen-cart  (Read 777 times)
KNM Computers
Liking it Here
***

Karma: 1
Offline Offline

Posts: 148


WWW
« on: June 07, 2011, 02:43:52 PM »

Hi i want to pull the background image of my website, but then i downloaded it from server it is only a thin long strip of the background, is there any way to stretch this image to what ever pixels i want?
Logged
seamus
zen master
Shareholder ;o)
*****

Karma: 44
Offline Offline

Gender: Male
Posts: 1109



WWW
« Reply #1 on: June 07, 2011, 03:54:25 PM »

you can make the background image any size you want.

the reason its only a thin strip is because its only a blue gradient, so to fill the screen the same image can be repeated horizontally insteading of loading one huge image, cuts down loading times doing it with a thin strip ;)

in includes/templates/coolblue/css/stylesheet.css at line 11

body {
    background: url("../images/background.jpg") repeat scroll 0 0 transparent;
    color: #000000;
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 62.5%;
    margin-top: 20px;
}

that controls the body tag and the background image, if you dont want to have the background image repeating, change this line:
     background: url("../images/background.jpg") repeat scroll 0 0 transparent;

to this:
    background: url("../images/background.jpg") no-repeat scroll 0 0 transparent;

this repeats horizontally only:
    background: url("../images/background.jpg") repeat-x scroll 0 0 transparent;

and this repeats vertically only:
    background: url("../images/background.jpg") repeat-y scroll 0 0 transparent;

choose which ever line you need from the above ^^

to change the background image, just save the new image as background.jpg and upload it to
includes/templates/coolblue/images
and overwrite the original,

when viewing your site for the first time after uploading the new image, make sure you give the screen a hard refresh (Ctrl and F5 at the same time)

great
« Last Edit: June 07, 2011, 03:56:46 PM by seamus » Logged

KNM Computers
Liking it Here
***

Karma: 1
Offline Offline

Posts: 148


WWW
« Reply #2 on: June 08, 2011, 09:36:52 AM »

Thankyou seamus but it's my fault i didnt word it  correctly...... I have pulled the background image from server ( well copyed to desktop) and want to resize (or strech) it maybe with adobr fireworks  to a size so i can upload it to total web soulations so then the payment  page when someone pays by credit/debit card it looks like a page from my web site?
Logged
seamus
zen master
Shareholder ;o)
*****

Karma: 44
Offline Offline

Gender: Male
Posts: 1109



WWW
« Reply #3 on: June 08, 2011, 02:19:00 PM »

you'll be ab;e to adjust the size of the original image using fireworks,

although you should be able to use the image as it is and just have it repeat as it is on your site, to fill the page on their payment page,
its only controlled with a bit of css its somthing that should be able tobe done on the total web solutions payment page
Logged

KNM Computers
Liking it Here
***

Karma: 1
Offline Offline

Posts: 148


WWW
« Reply #4 on: June 08, 2011, 02:33:31 PM »

Thankyou seamus done it  in end thankyou for help anyway  great
Logged
shankar.adodis
Settling In
**

Karma: 0
Offline Offline

Gender: Male
Posts: 40



« Reply #5 on: June 30, 2011, 07:03:48 AM »

Hello,

You can use.background:url(imagename) repeat-x  scroll 0 0 ;

in your css to stretch along the background .
Logged
seamus
zen master
Shareholder ;o)
*****

Karma: 44
Offline Offline

Gender: Male
Posts: 1109



WWW
« Reply #6 on: June 30, 2011, 03:28:46 PM »

Hello,

You can use.background:url(imagename) repeat-x  scroll 0 0 ;

in your css to stretch along the background .

you're slightly late with that info ;)
Logged

Pages: [1] Print 
« previous next »
Jump to:  


Powered by MySQL Powered by PHP Powered by SMF 1.1.15 | SMF © 2011, Simple Machines Valid XHTML 1.0! Valid CSS!
SimplePortal 2.2.2 © 2008-2009