creating new templates for CSS/PHP virgin

[Sutekh]

I am a complete noob. I am helping my friend with his website which until now has been entirely very basic html editing. Neither of us has ever done anything with PHP or CSS except that which is automatically generated for us by programs such as dreamweaver. I've been trying to pick it up as I'm going along.

I was trying to follow the instructions in the zen-cart.com wiki for creating a new store template... all seemed to be going well, i created a new as yet unmodified template - first thing I noticed is that all the colours changed and the logo.gif and header_bg.jpg vanished.
I worked out where I could edit all the colours in the includes/templates/MY_TEMPLATE/css/stylesheet.css and got my custom logo.gif to appear in the header... but for the life of me, I cannot work out how, where or what to modify in order to get the background image header_bg.jpg to show up in my template. I have a background I made which I would like to display behind the logo in the same way that the classic template Zen-Cart logo does.

Do I need to add something like...

TABLE.header {
background-image: url(../images/header_bg.jpg);
background-repeat: repeat-x;
background-color: #ffffff;
border-right: 1px solid #9a9a9a;
border-left: 1px solid #9a9a9a;
border-bottom: 1px solid #9a9a9a;

...into my stylesheet.css file in my template's css directory? I tried pasting this into my template's stylesheet.css file but it made no difference - maybe I didn't put it into the correct place in the file??? The url path in the example above is correct for my custom header_bg.jpg - I have uploaded my image to /MY_TEMPLATE/images/ directory

Where have I gone wrong?
Please don't kill me.

[bunyip]

You're on the right track, but add that style for the #logoWrapper id, rather than TABLE.header, so you have:

#logoWrapper {
background-image: url(../images/header_bg.jpg);
background-repeat: repeat-x;
background-color: #ffffff;
border-right: 1px solid #9a9a9a;
border-left: 1px solid #9a9a9a;
border-bottom: 1px solid #9a9a9a
}

[Sutekh]

You're on the right track, but add that style for the #logoWrapper id, rather than TABLE.header, so you have:

#logoWrapper {
background-image: url(../images/header_bg.jpg);
background-repeat: repeat-x;
background-color: #ffffff;
border-right: 1px solid #9a9a9a;
border-left: 1px solid #9a9a9a;
border-bottom: 1px solid #9a9a9a
}

hmm... ok, I must still be doing something wrong cos it's still not showing.

After further investigation I think I may be onto something - If I right-click the logo.gif image in firefox and get properties, it tells me the image is being loaded from /zencart/includes/templates/template_default/images/logo.gif instead of /zencart/includes/templates/MY_TEMPLATE/images/logo.gif like I thought it was.

What is this telling me?

[gjh42]

Are you sure you've activated your template in Admin? If you view the stylesheet for the page being displayed, is it your template or template_default?

[bunyip]

do you have a URL for the store?

From Admin > Tools > Template Selection, what does it show as the template directory for the current template?

[Sutekh]

I see this in the Template selection page...

http://i7.photobucket.com/albums/y26.../screencap.jpg

[Sutekh]

do you have a URL for the store?

http://johngordon.com.au/zencart

[Sutekh]

it's entireley possible I may have cocked up somewhere during creation of the new template, fooling about with files I shouldn't be. It may be easier if I uninstall everything from the server and start again from scratch... or do you think there is a chance I can still resurrect something from this mess I've made?

[DrByte]

It seems you haven't created a folder for
includes/templates/shop_template/images ... and stuck your image files in there

[bunyip]

Have to agree with the Doc there - there is no file /includes/templates/shop_template/images/logo.gif