minimal carts - maximum customization?

I need to make VERY minimal carts. Most of the carts I'd like to make would sell only a single item. And the cart I'm trying to customize now will have only 10 items.

I don't need ANYTHING on the page from the default template except:
a center column for the products
a right sidebox shopping cart, (no left sidebox/column at all) and -
the UPS module for shipping calculation.

I want my own background image - a simple gradient - tiled down the page, and the only items on the page would be:
a header image,
a footer image, and
the product line-up.

I don't want colored backgrounds for the columns - I want the background image to show through.

As I plow through the customization and get rid of all the stuff I don't want, the more I pare it down the more it seems like I won't be able to achieve this goal. All the Zen Carts I've seen have looked more or less the same, with just header and color scheme variations. None seem to have gone as far as I want to with customization. Some things just seem like they are not editable.

So now I'm beginning to wonder if Zen Cart is the cart to use.

Any advice would be most appreciated.

FYI I'm using 1.3.8a.

adville:

I don't need ANYTHING on the page from the default template except:
a center column for the products
a right sidebox shopping cart, (no left sidebox/column at all) and -
the UPS module for shipping calculation.

Great! Dont worry about things that you dont need. Just deactivate them.

You can easily disable the right column in the Admin Configuration > ... > Disable Left Sidebox Globally or just dont activate any sidebox on the left column.

adville:

I want my own background image - a simple gradient - tiled down the page, and the only items on the page would be:

1. a header image,
2. a footer image, and
3. the product line-up.

Your customizations fall under your so called "just header and color scheme variations" category.

1 + 2 can be changed in the stylesheet.

3. is in the Admin section of your shopping cart.

adville:

I don't want colored backgrounds for the columns - I want the background image to show through.

Excellent! Don't assign a color for the columns in your stylesheet.

adville:

As I plow through the customization and get rid of all the stuff I don't want, the more I pare it down the more it seems like I won't be able to achieve this goal.

I wonder why. How far have you gotten with your customization? Maybe post a link of your website.

adville:

All the Zen Carts I've seen have looked more or less the same, with just header and color scheme variations. None seem to have gone as far as I want to with customization. Some things just seem like they are not editable.

Now, I dont know which carts you have seen, but many websites have customized their Zencart a lot and they look very nice.

adville:

So now I'm beginning to wonder if Zen Cart is the cart to use.

You are strongly encouraged to try other shopping carts to learn your own lesson about individual customization.

Apart from the left sidebox no showing, the rest is more or less CSS customisation, smart use of images and moving sections of php code in template files to suit your individual website arrangements.

Many thanks for a comprehensive reply.

The pathetic state of my cart - stripped down as far as I've manged so far:
http://www.funnyguycards.com/cards/

I want to remove all those horizontal bars that contain the Home link, as well as removing the Home link itself.

"...Don't assign a color for the columns in your stylesheet..."

I don't know where on the stylesheet so many of these elements are - such as the columns, the place to define background color, background image, header, footer.

My trouble is that I'm used to making web pages using Dreamweaver. And I'm not great at hand-coding stuff, so this is all a bit intimidating.

again, thanks.

adville:

Many thanks for a comprehensive reply.

The pathetic state of my cart - stripped down as far as I've manged so far:
http://www.funnyguycards.com/cards/

I want to remove all those horizontal bars that contain the Home link, as well as removing the Home link itself.

"...Don't assign a color for the columns in your stylesheet..."

I don't know where on the stylesheet so many of these elements are - such as the columns, the place to define background color, background image, header, footer.

My trouble is that I'm used to making web pages using Dreamweaver. And I'm not great at hand-coding stuff, so this is all a bit intimidating.

again, thanks.

lets start with this:

I want my own background image - a simple gradient - tiled down the page

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

Find the following:

body {
	margin: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 62.5%;
	color: #FFFFFF;
	background-color: #000000
	background-image:includes/templates/my_own_template/images/TurqBackground.png;
	}

Make the following changes:

body {
	margin: 0;
      padding: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 62.5%;
	color: #000; 
	background: url(../images/TurqBackground.png);
}

Wow - so much help here. This is very encouraging. Thanks! I made that change Clyde:

http://www.funnyguycards.com/cards/

adville:

Wow - so much help here. This is very encouraging. Thanks! I made that change Clyde:

http://www.funnyguycards.com/cards/

Moving on:

I don't want colored backgrounds for the columns - I want the background image to show through.

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

find the following:

#mainWrapper {
	background-color: #ffffff;
	text-align: left;
	width: 100%;
	vertical-align: top;
	}
	
#navColumnTwo {
	background-color: #00BFBF;
	}

make the following changes:

#mainWrapper {
	background-color: transparent;
	text-align: left;
	width: 100%;
	vertical-align: top;
	}
	
#navColumnTwo {
	background-color: transparent;
	}

Clyde! Thanks for holding my hand on this :)

Duly edited:
http://www.funnyguycards.com/cards/

adville:

Clyde! Thanks for holding my hand on this :)

Duly edited:
http://www.funnyguycards.com/cards/

You still need to do the right column

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

find the following:

#navColumnTwo {
	background-color: #00BFBF;
	}

and make the following change:

#navColumnTwo {
	background-color: transparent;
	}

done that now
http://www.funnyguycards.com/cards/

adville:

done that now
http://www.funnyguycards.com/cards/

Next

and the only items on the page would be:
a header image, a footer image

If you haven't done so already, create your header and footer images and save them to:

includes/templates/my_own_template/images/

You might want to make the following change:

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

find the following:

body {
margin: 0;
padding: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #000;
background: url(../images/TurqBackground.png);
}

and make the following change:

body {
margin: 0;
padding: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #fff;
background: url(../images/TurqBackground.png);
}

}

yes - all my images are there and ready to go

What I'm trying to achieve is a cart that looks like this:

http://adville.com/MarqueeCards.html

but with the right sideboxes - shopping cart and UPS module.

I realize I may well have to reduce the size of the postcard images in order to fit a 150 pixel wide right side box column. That is, if I can still place two cards side by side.

adville:

yes - all my images are there and ready to go

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

add the following:

#logoWrapper{
margin:0;
padding:0;
background: url(../images/YOUR_HEADER_IMAGE.jpg) no-repeat;
position: relative;
height:77px;/* This should be the same height and your header image*/
width:100%;
top:0;
left:0;
}

Lets do this one next

right sidebox shopping cart

go to admin -> configuration -> layout settings -> Shopping Cart Box Status (set to 0)

done - this is fantastic help Clyde

I'm not a big fan of "fluid" width.

I'd make the following change(s):

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

#mainWrapper {
margin: 0 auto;
background-color: transparent;
text-align: left;
width: 980px;
vertical-align: top;
}

And lets tweak your header image

#logoWrapper{
margin:0 auto;
padding:0;
background: url(../images/DentalCardHeader.gif) no-repeat;
position: relative;
height:190px;/* This should be the same height and your header image*/
width:530px;
text-align: center;
}

header logo still seems to want to go to the left, and it also looks like there's a transparent column there on the left. Meanwhile I'm still trying to wrangle colors/transparency of page elements. And those damn Home links in horizontal bars - albeit transparent - won't go away.

You must have the pateince of a saint, Clyde :)

adville:

header logo still seems to want to go to the left, and it also looks like there's a transparent column there on the left. Meanwhile I'm still trying to wrangle colors/transparency of page elements. And those damn Home links in horizontal bars - albeit transparent - won't go away.

You must have the pateince of a saint, Clyde :)

open your stylesheet.css (includes/templates/my_own_template/css/stylesheet.css)

make the following changes

#logoWrapper{
margin:0 auto;
padding:0;
background: url(../images/DentalCardHeader.gif) center center no-repeat;
position: relative;
height:190px;/* This should be the same height and your header image*/
text-align: center;
}

that centered it

also - i now understand that the header is indeed central and spans the entire width of the page, while the left of the two visible columns below is also center aligned: it's just that it has a column to the right too.