Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls
 

inserting code to input image background

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions > Changing design
 
Thread Tools Search this Thread
  #1  
Old 07-02-2008, 03:09 PM
 
RandyK RandyK is offline
 

Advanced Member
  
Join Date: Jul 2008
Posts: 63
 

Default inserting code to input image background

I'm in the css.skin1 template trying to insert an image tag in the HTML,BODY section to allow for the right and left sides of my site to have a textured look (image). I am using the following code:
<img src="{$ImagesDir}/blue095.gif"border=0>
Is this wrong? I am somewhat of a rookie, where would I insert this code if it is correct?
__________________
4.1.10
4.2
X-Magnifier
Fancy Categories
Reply With Quote
  #2  
Old 07-02-2008, 04:25 PM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default Re: inserting code to input image background

Yep, that's wrong Add this to the body class:

background: url(images/blue095.gif); background-repeat: no-repeat;

If you want it to repeat, change the no-repeat to x or y instead of no-repeat. Grab yourself a CSS book, you'll need it with X-Cart
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #3  
Old 07-02-2008, 06:12 PM
 
RandyK RandyK is offline
 

Advanced Member
  
Join Date: Jul 2008
Posts: 63
 

Default Re: inserting code to input image background

Thank you for your assistance but I still can't get it to work. Here is how it's coded:

HTML,BODY {
HEIGHT: 100%;
MARGIN: 0px;
PADDING:0px;
BACKGROUND-COLOR: http://www.outdoorartsite.com(images/blue095.gif); background-repeat: no-repeat;
}

Any ideas?
__________________
4.1.10
4.2
X-Magnifier
Fancy Categories
Reply With Quote
  #4  
Old 07-02-2008, 06:24 PM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default Re: inserting code to input image background

That's not what I posted above...use exactly what I posted.

HTML,BODY {
HEIGHT: 100%;
MARGIN: 0px;
PADDING:0px;
BACKGROUND: url(images/blue095.gif); background-repeat: no-repeat;
}

Upload the image to the skin1/images folder.
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #5  
Old 07-02-2008, 06:30 PM
 
RandyK RandyK is offline
 

Advanced Member
  
Join Date: Jul 2008
Posts: 63
 

Default Re: inserting code to input image background

Got it, thank you.
__________________
4.1.10
4.2
X-Magnifier
Fancy Categories
Reply With Quote
  #6  
Old 08-08-2008, 09:54 PM
 
gennarof gennarof is offline
 

Advanced Member
  
Join Date: Feb 2008
Posts: 46
 

Default Re: inserting code to input image background

Quote:
Originally Posted by balinor
That's not what I posted above...use exactly what I posted.

HTML,BODY {
HEIGHT: 100%;
MARGIN: 0px;
PADDING:0px;
BACKGROUND: url(images/blue095.gif); background-repeat: no-repeat;
}

Upload the image to the skin1/images folder.

Balinor.. would I use pretty much the same approach to insert a backgroud image in my header.? If so could you let me know where to put it.?

Thanks
__________________
Ver 4.1.9
Reply With Quote
  #7  
Old 08-08-2008, 10:21 PM
  ARW VISIONS's Avatar 
ARW VISIONS ARW VISIONS is offline
 

X-Man
  
Join Date: Jan 2007
Location: Pensacola, FL
Posts: 2,536
 

Default Re: inserting code to input image background

You can set a background image for any element you want.

You just ahve to assign the element an ID or class and set the background image.

Open the head.tpl and you could use somehting like this.

<table cellpadding="0" cellspacing="0" width="100%" align="center" id="headBG">

then in your skin1.css you could use

#headBG{
BACKGROUND: url(images/whateverYourImageIsCalled.gif); background-repeat: no-repeat;
}

set the properties to whatever you want for repeat and placement.

make sure you upload the image to the skin1/images directory.

here is an excellent site for learning CSS

http://www.w3schools.com/
__________________
xcart 5.1.2
Reply With Quote
  #8  
Old 08-08-2008, 11:21 PM
 
gennarof gennarof is offline
 

Advanced Member
  
Join Date: Feb 2008
Posts: 46
 

Default Re: inserting code to input image background

Quote:
Originally Posted by Ashley
You can set a background image for any element you want.

You just ahve to assign the element an ID or class and set the background image.

Open the head.tpl and you could use somehting like this.

<table cellpadding="0" cellspacing="0" width="100%" align="center" id="headBG">

then in your skin1.css you could use

#headBG{
BACKGROUND: url(images/whateverYourImageIsCalled.gif); background-repeat: no-repeat;
}

set the properties to whatever you want for repeat and placement.

make sure you upload the image to the skin1/images directory.

here is an excellent site for learning CSS

http://www.w3schools.com/
Thanks Ashley I inserted exactly as you suggested and so far absolutely nothing has happened when I load my home page.. strange.I would have thought that it would have at least been messed up if I did something wrong. I will take a min and flush the cash. Maybe the page is not loadind from the server.
Any thoughts.?

thanks
__________________
Ver 4.1.9
Reply With Quote
  #9  
Old 08-09-2008, 12:31 AM
  ARW VISIONS's Avatar 
ARW VISIONS ARW VISIONS is offline
 

X-Man
  
Join Date: Jan 2007
Location: Pensacola, FL
Posts: 2,536
 

Default Re: inserting code to input image background

did you cahnge the whateveryourimageiscalled.gif to the name of the file you uploaded?

did you save it as a gif and not a jpg??

Have you uploaded the head.tpl and skin1.css?

This has to be exact.

the name of the id you put in the head and the id you put in your CSS file must match.

id="headBG"
#headBG{
}

The file name you upload to the skin1/images directory must match the fiel name you place in the css file.


yourfile.gif

#headBG{
background: url(images/yourfile.gif) no-repeat right center;
}
__________________
xcart 5.1.2
Reply With Quote
  #10  
Old 08-09-2008, 05:39 PM
 
gennarof gennarof is offline
 

Advanced Member
  
Join Date: Feb 2008
Posts: 46
 

Default Re: inserting code to input image background

Ashley... Thanks Very Much... I am going absolutely insane with this header / graphic and I have so much else I need to do. If you could look at www.desertvalleyelectronics.com and examine the header / background image maybe you could make sense of it because I can't.


From left to right:
LEFT IMAGE IS THE LOGO UP TO WHERE THE "y" is sliced off just about in half. (Full back ground Banner with logo should read " Desert Valley Radio" )

Right Image contains the rest of the "y" that was in the logo and the word Radio. the truck that you see is on the end of the background image. I have no idea why it appears twice at all. Also, the word Radio is part of the backgroud image and only appears once. I don't know how it appears more then once. ..

ANY HELP UNDERSTANDING THIS WEIRD APPEARENCE OF MULTIPLE PARTS OF THE SAME IMAGE AND HOW TO CORRECT IT WOULD BE VERY MUCH APPRECIATED. I CAN SEND YOU A COPY OF THE ORIGINAL IMAGE IF YOU LIKE. (SMALL GIF)

THANKS AGAIN
GETTING FRUSTRATED
__________________
Ver 4.1.9
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions > Changing design



Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 02:49 AM.

   

 
X-Cart forums © 2001-2020