Adding a background image

[Jen Will]

I want to add a background image to my template. I looked at the style sheet , but it has it for background color. What would be the code to add a background image instead of the color it has.

[afo]

I don't know where you want to add the image, but I'm using a background image on the Fan Odyssey site in my sig. Here's part of my stylesheet. I've highlighted the image in red.

/*wrappers - page or section containers*/
#mainWrapper {
	background-color: #000000;
                background-image: url('../images/space011.jpg');
	text-align: left;
	width: 100%;
	vertical-align: top;
	}

[Jen Will]

I have that code but its not doing anything thats why I asked. I am looking to change the background of the template not the inside where you see the boxes I mean the back of the template itself. Maybe I am on the wrong sytel sheet page. I went to includes/templates/classic/css and then brought up the style sheet.

[gjh42]

Where do you have your image saved? It needs to be in /includes/templates/classic/images/yourimage.gif, if you are using the Classic template.

To display your image outside of the boxes etc., you would put the background-image: code in the "body {" declaration.

[Jen Will]

I just don't know why its not changing it to the image instead it changes the color of the side bars.
This what I have
body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #000000;
background-image: url('../images/Dbluewidestrip.gif');
}

My image is in the correct folder and I am in the templates style sheet.

[afo]

I have that code but its not doing anything thats why I asked. I am looking to change the background of the template not the inside where you see the boxes I mean the back of the template itself. Maybe I am on the wrong sytel sheet page. I went to includes/templates/classic/css and then brought up the style sheet.

You shouldn't be editing anything in the /classic/ folders or all your changes will be lost in the next upgrade/update. You should be using the override system to create a template.

To create a very basic custom template (you can build from there), you need:

• includes/languages/YOUR_TEMPLATE/english.php
• includes/languages/english/YOUR_TEMPLATE/index.php
• includes/languages/english/YOUR_TEMPLATE/meta_tags.php
• includes/languages/english/YOUR_TEMPLATE/header.php (to change the logo)
• includes/templates/YOUR_TEMPLATE/template_info.php
• includes/templates/YOUR_TEMPLATE/common/tpl_header.php
• includes/templates/YOUR_TEMPLATE/common/tpl_footer.php
• includes/templates/YOUR_TEMPLATE/images/logo.gif
• includes/templates/YOUR_TEMPLATE/css/stylesheet.css

Anywhere you see a /classic/ folder, you can create a folder for your custom template. You can copy the necessary files from either the /classic/ folder, the /template_default/ folder or the parent folder.

Edit includes/templates/YOUR_TEMPLATE/template_info.php to give your template identifying information so you'll recognize it in the admin under tools->template selection.

I don't have the image in the "body" tag at all in my stylesheet for Fan Odyssey, but I do have it various other places. It really depends on where you want the image to show up.

[Jen Will]

I am not looking to rebuild the template all I want is to add a background image thats all. I already have a back up of the style sheet.

[afo]

If you continue to make changes in the /classic/ folders, YOUR CHANGES WILL BE OVERWRITTEN BY THE NEXT UPGRADE/UPDATE. Creating your own template is simple (follow the list I posted) and will save you much heartache later on.

This is where I added the background image to do the Fan Odyssey site.

#mainWrapper {

#logoWrapper{

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {

#navCatTabsWrapper {

.centerBoxWrapper {

.leftBoxContainer, .rightBoxContainer {

.sideBoxContent {

[abwhitney]

Ok so I just found this out now. I'm new at Zen-Cart. Question:

I have spent days building categories and uploading products. From what I can see when I change templates I lose any categories, products, customer info, banner settings, etc. It would take days to go back and make all those changes. Without changing code is there a way to migrate these types of settings from one template to another so I can start using my own template without having to redo all the settings and re-upload all the data again? I really hope so.

Thanks.

If you continue to make changes in the /classic/ folders, YOUR CHANGES WILL BE OVERWRITTEN BY THE NEXT UPGRADE/UPDATE. Creating your own template is simple (follow the list I posted) and will save you much heartache later on.

This is where I added the background image to do the Fan Odyssey site.

#mainWrapper {

#logoWrapper{

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {

#navCatTabsWrapper {

.centerBoxWrapper {

.leftBoxContainer, .rightBoxContainer {

.sideBoxContent {

[afo]

You shouldn't lose categories or products by changing the template.