Cherry Zen Template Support Thread

[xmisspurrfect]

Hello all!

Thank you for the fabulous template. I have a question/problem...

This is the website: www.tuscanywines.net/catalog/

the right column headers don't want to line up.. it's been driving me nuts! Please help!! :)

[tr1guy]

Hi there! I'm new to the Cherry Zen Thread and I'm trying to get the Add to Cart button under the price. I have tried a variety of things and done some searching, but I can't seem to find a fix.

The catalog is here if you need to see it: Click here.

Or the product page is here: Click here

It is Zen CArt version 1.3.8a Thank you for any help. Byron Wilkins.

[jettrue]

Hi there! I'm new to the Cherry Zen Thread and I'm trying to get the Add to Cart button under the price. I have tried a variety of things and done some searching, but I can't seem to find a fix.

The catalog is here if you need to see it: Click here.

Or the product page is here: Click here

It is Zen CArt version 1.3.8a Thank you for any help. Byron Wilkins.

You have to open up includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.php and find the add to cart section, and move it where you'd like it.

[esugrue]

Hi!

I think this has been asked before but I cannot find it anywhere.

I am having an issue with CZ displaying in a clients website.

The RHS sideboxes extend into the background and the header bar seems to be on a separate line than the search box at the far left.

Here is an image of of the RHS sideboxes and you can see the end of the word Checkout is on a second line at the top.



I have set the width of the template as 1000 px in the stylesheet.css which is below in case I need to edit that!!!

/* This section controls the colors for the site. Change green (default) to one of these options: green, green, green, green, green, or green) */

input#searchTop {

background: url("../images/green/rounded-search-input-top.gif") top left no-repeat;

}



#navMainWrapper {

background:url("../images/green/header.gif");

}



h3.leftBoxHeading, h3.rightBoxHeading {

background: url("../images/green/sideboxbg.gif");

}



#navMain a {

background:url("../images/green/tableftE.gif") no-repeat left top;

}



#navMain a span {

background:url("../images/green/tabrightE.gif") no-repeat right top;

}



#navMain a span.last {

background:url("../images/green/tabrightE_last.gif") no-repeat right top;

}



/* end main color changes */





/* other background color or image changes */

body {

background:#84A4C1; /* main site background color, green default */

}



#headerWrapper {

background:#ffffff; /* background color behind logo and sales text, white default */

}



input:focus, select:focus, textarea:focus {

background:#e0e8ef; /* background color for input boxes, light green default */

}



.messageStackWarning, .messageStackError {

background:#990000; /* background color for warning messages, green default */

}



.messageStackSuccess {

background:#929292; /* background color for success messages, green default */

}



.messageStackCaution {

background:#FFFF99; /* background color for caution messages, green default */

}



#cartSubTotal, h2.centerBoxHeading, .rowOdd {

background:#e8e9e9; /* background color for the New Product, Featugreen Products and Specials heading, odd listings, and for the subtotal section in the cart, light green default */

}



TR.tableHeading {

background:#cacaca; /* background color for various table headings (including shopping cart heading), medium green default */

}



.rowEven {

background:#F0F0F0; /* background color for even listings, very light green default */

}



#navEZPagesTop {

background:url("../images/ezbg.gif") repeat-x; /* green background image behind ezpages section */

}



#contentMainWrapper {

background:url("../images/sidebox.gif") 100% 0 repeat-y; /* This is the right column background "faked" with an image. */

background-color:#ffffff; /*background color for the main "content" of the site */

}



#contentMainWrapperb {

background: url("../images/sidebox.gif") 0 0 repeat-y; /* This is the left column background "faked" with an image. */

}



input.search {

background: url("../images/rounded-search-input.gif") top left no-repeat; /* rounded search image for the search sidebox */

}





/* font color changes */



body {

color:#000000; /* main site font color*/

}



a:link {

color:#4f4f4f; /* main site links color */

text-decoration:none;

}



a:visited {

text-decoration:none; /* color of links after customer has visited them */

color:#313131;

}



a:hover {

color:#000000; /* color when links are hovegreen over */

text-decoration:none;

}



h3.leftBoxHeading, h3.rightBoxHeading {

color:#ffffff; /* right and left box heading color */

}



.leftBoxHeading a, .rightBoxHeading a {

color:#ffffff; /* right and left box LINK heading color */

}



.leftBoxHeading a:hover, .rightBoxHeading a:hover {

color:#E8E9E9; /* right and left box LINK heading color when hovegreen over*/

}



#navMain a span {

color:#ffffff; /* color of header links, HOME, LOGIN, MY ACCOUNT, etc. */

}



#navMain a:hover span {

color:#ffffff; /* color of header links, HOME, LOGIN, MY ACCOUNT, etc. when hovegreen over */

}



#tagline {

color:#333333; /* tagline text color */

}



#productPrices {

color:#9F1C00; /* color of price */

}



.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount, .alert {

color:#990000; /* color of sale prices and alerts */

}



.messageStackWarning, .messageStackError {

color:#ffffff; /* color of warning message text */

}



/* end of site font color changes */





/* site and main content width section */



html>body {

width: auto;

}



#nw {

width:90%; /* main site width; if you'd prefer a fixed width site, enter the width in px here. */

max-width:1000px; /* prevents the main content from getting wider than 1300px in sites other than IE */

min-width:1000px; /* this prevents the main content from getting smaller than 1000px in browsers OTHER THAN IE. You can make this as small as 800px, BUT any smaller than that, and the top header menu will break into two lines. Also, if you make this width 800px, you will need to make sure your product image on the product info page is no wider than 190px */

}



/* IE only. Controls Width of Site and Main Content*/

* html #nw {

width:expression((d=document.compatMode=="CSS1Compat" ? document.documentElement : document.body) && (d.clientWidth > 1000? "1000px" : d.clientWidth > 1048? "80%" : d.clientWidth < 1048? "1000px" : "80%")); /* this prevents the site from getting smaller than 1000px or wider than 1300px in IE */

}

/* end IE only */

/* end site and main content width section */





/*wrappers - page or section containers*/

#nw {

text-align:left;

vertical-align:top;

margin:0 auto;

}



#headerWrapper {

float:left;

width:100%;

}



#navMainWrapper {

height:32px;

width:100%;

font-size:12px;

}



#logoWrapper {

width:auto;

}



#logo {

float:left;

padding-left:0px;

text-align:center;

}



#taglineWrapper {

width:60%;

float:left;

}



#tagline {

font-size:1.1em;

font-weight:bold;

text-align:center;

padding:25px 0px 35px 0px;

}



#navEZPagesTop {

font-weight:bold;

width:auto;

padding:7px 0;

}



#navEZPagesTop a {

padding:0 8px;

}





#contentMainWrapper {

line-height:1.4;

min-height: 100%;

}



#contentMainWrapperb {

min-height: 100%;

}



* html #contentMainWrapper {

height: 100%;

}



.outer {

padding-left: 165px; /* Same width as margin-left for the float-wrap div */

padding-right: 150px; /* Our right column width */

}



.inner {

width: 100%;

}



.float-wrap {

float: left;

width: 97%;

margin-left: -165px; /* Same length as .outer padding-left but with negative value */

}



#content {

float: right;

margin-right: -165px; /* Same length as .outer padding-left but with negative value */

width: 100%;

line-height:1.6;

position: relative; /* IE needs this */

}



.contentWrap{

padding: 5px 0 5px 5px;

}



#navColumnOne {

float: left;

position: relative; /* IE needs this */

}



#navColumnTwo {

float: right;

margin-right: -150px; /* This negative margin-right value is in this example the same as the right column width. */

position: relative; /* IE needs this */

}



/* end wrappers - page or section containers*/





* {

margin:0;

padding:0;

}



body {

font-family: "Lucida Grande", tahoma, verdana, arial, helvetica, sans-serif;

font-size:73.5%;

margin-top:0px;

}



a img {

border:none;

}



ul, ol {

text-align:left;

padding-left:25px;

margin-left:10px;

margin-bottom:10px;

}



h1 {

font-size:1.3em;

}



h2 {

font-size:1.2em;

}



h3 {

font-size:1.1em;

}



h4, h5, h6, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger {

font-size:1.0em;

}



LEGEND {

color:#333;

}



.biggerText {

font-size:1.1em;

}



h1, h2, h3, h4, h5, h6 {

margin:.3em 0;

}



CODE {

font-family:tahoma, arial, verdana, helvetica, sans-serif;

font-size:1em;

}



FORM, SELECT {

display:inline;

font-size:1em;

margin:.5em;

}



option {

padding-right:.5em;

}



INPUT{

margin:.3em .5em;

}



html>/**/body input[type=checkbox], html>/**/body input[type=radio] {

float:left;

clear:both;

}



html>/**/body .checkboxLabel, html>/**/body .radioButtonLabel {

margin:0 .2em .5em 0;

float:left;

}



.ratingRow input[type=radio]{

float:none;

margin:0 .5em;

}



TEXTAREA {

margin:auto;

display:block;

width:95%;

}



FIELDSET {

padding:.5em;

margin:.5em 0;

border:1px solid #cccccc;

}



LEGEND {

font-weight:bold;

padding:.3em;

}



h4.optionName {

padding-right:1em;

}



.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {

float:left;

}



LABEL.inputLabel {

width:90%;

float:left;

margin:.3em;

}



LABEL.inputLabelPayment {

width:15em;

float:left;

padding:.5em;

}



LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {

width:12em;

float:left;

}



ADDRESS {

font-style:normal;

padding-right:40px;

}



.clearBoth {

clear:both;

height:0;

font-size:0;

line-height:0;

}



.clearfix:after {

content: ".";

display: block;

height: 0;

clear: both;

visibility: hidden;

}



.clearfix {display: inline-block;}



/* Hides from IE-mac \*/

* html .clearfix {height: 1%;}

.clearfix {display: block;}

/* End hide from IE-mac */



HR {

height:1px;

margin:.5em 0;

border:none;

border-bottom:1px solid #9a9a9a;

}



.messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {

padding:.2em;

}



/* product info page css */



#cartAdd {

width:125px;

text-align:center;

margin:10px auto;

float:right;

padding-right:10px;

}



#cartAdd input {

margin:.3em 0 0 0;

}



#productDescription {

border:1px solid #bfbfbf;

margin-top:20px;

clear:both;

}



#rightFloat {

float:left;

width:45%;

}



#leftFloat {

float:left;

text-align:center;

}



#productDetailsList {

float:left;

}



ul#productDetailsList {

}



#productAttributes {

width:100%;

float:left;

border:1px solid #bfbfbf;

padding-left:5px;

margin:5px 0 0 10px;

}



#productImage {

margin:0 auto;

text-align:center;

}



.imgLink {

text-align:center;

margin:0 auto;

display:block;

width:100%;

}



#friendReview {

width:200px;

padding:15px 0 10px 0;

float:left;

clear:left;

text-align:left;

}



.reviewCount {

float:left;

padding-left:2px;

}



#productReviewLink {

padding:5px 0;

}



.wrapperAttribsOptions {

line-height:2em;

width:auto;

float:left;

}



.wrapperAttribsOptions h4 {

padding-right:15px;

}



/* end product info page css */





/* css for top menu tabs */



#navMain {

float:right;

width:870px;

line-height:normal;

}



#navMain ul {

float:right;

list-style:none;

}



#navMain li {

display:inline;

}



#navMain a {

float:left;

text-decoration:none;

}



#navMain a span {

float:left;

display:block;

padding:7px 10px 7px 10px;

text-align:center;

width:100px;

cursorointer;

}



/* Commented Backslash Hack hides rule from IE5-Mac \*/

#navMain a span {float:none;}

/* End IE5-Mac hack */



#navMain a:hover {

background-position:0% -32px;

}



#navMain a:hover span {

background-position:100% -32px;

}



/* end css for top menu tabs */





.navNextPrevWrapper {

margin-bottom:1em;

}



.navPrevCounter {

font-size:.9em;

}



.navNextPrevList {

display:inline;

white-space:nowrap;

padding:0 1em;

list-style-type:none;

position:relative;

}



#navSuppWrapper {

width:100%;

margin:0 auto;

float:left;

}



#navSupp {

margin:0 auto;

text-align:center;

padding-top:1em;

}



#navSupp ul {

list-style-type:none;

text-align:center;

line-height:1.5em;

padding: .3em 0;

}



#navCatTabs ul {

list-style-type:none;

text-align:center;

}



#navSupp li, #navCatTabs li {

display:inline;

padding:0 .5em;

}



#navSupp ul li a, #navCatTabs ul li a {

text-decoration:none;

white-space:nowrap;

display:inline;

font-weight:bold;

width:0;

}



#navEZPagesTOCWrapper {

font-weight:bold;

float:right;

height:1%;

border:1px solid #000000;

}



#navEZPagesTOC ul {

padding: .5em 0;

list-style-type:none;

line-height:1.5em;

}



#navEZPagesTOC ul li {

white-space:nowrap;

}



#navEZPagesTOC ul li a {

padding:0 .5em;

}



#navCategoryIcon, .buttonRow, #indexProductListCatDescription {

margin:.5em;

}



#navMainSearch {

float:left;

width:120px;

}



input.search {

border: 0;

width: 100px; /* width of text-display area */

padding: 3px 15px 4px 20px;

font-size: 11px;

}



input#searchTop {

border: 0;

width: 115px; /* width of text-display area */

padding: 4px 15px 5px 20px;

font-size: 12px;

}



* html input#searchTop {

background-attachment: fixed;

}



#navBreadCrumb {

text-align:left;

line-height:1.6em;

font-size:.95em;

padding:.2em 0;

}



#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatugreen, .centerBoxContentsNew, .alert {

vertical-align:top;

}



#productDescription, .shippingEstimatorWrapper {

padding:.5em;

}



.important {

font-weight:bold;

padding:.5em;

}



.gvBal {

float:right;

}



#bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {

padding:.8em;

}



.smallText, #siteinfoLegal, #siteinfoCgreenits, #siteinfoStatus, #siteinfoIP {

font-size:.9em;

}



#siteinfoLegal {

padding-bottom:1em;

clear:both;

}



.tableHeading TH {

border-bottom:1px solid #cccccc;

}



#cartSubTotal {

border-top:1px solid #cccccc;

font-weight:bold;

text-align:right;

line-height:2.2em;

padding-right:2.5em;

}



.tableRow, .tableHeading, #cartSubTotal {

height:2.2em;

}



.cartProductDisplay, .cartUnitDisplay, .cartTotalDisplay, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartInstructionsDisplay, .cartTotalsDisplay {

padding:.5em 0 0;

}



#cartProdTitle {

text-align:center

}



.cartUnitDisplay, .cartTotalDisplay {

text-align:center;

padding-right:.2em;

}



.cartRemoveItemDisplay input[type=checkbox] {

float:none;

margin-bottom:1em;

}



#scUpdateQuantity {

width:1.8em;

}



#scProductsHeading {

padding-left:2em;

}



.cartQuantity {

width:4em;

}



.cartNewItem {

position:relative; /*do not remove-fixes stupid IEbug*/

}



.cartOldItem {

position:relative; /*do not remove-fixes stupid IEbug*/

}



.cartBoxTotal {

text-align:right;

font-weight:bold;

padding-right:10px;

}



.cartRemoveItemDisplay {

width:5em;

}



.cartAttribsList {

margin-left:1em;

}



#mediaManager {

width:50%;

margin:.2em;

padding:.5em;

}



.normalprice, .productSpecialPriceSale {

text-decoration:line-through;

}



.orderHistList {

margin:1em;

padding:.2em 0;

}



#ezPageBoxList li{

padding:.2em 0;

}



#cartBoxEmpty, #cartBoxVoucherBalance {

font-weight:bold;

}



.totalBox {

width:5.5em;

text-align:right;

padding:.2em;

}



.lineTitle, .amount {

text-align:right;

padding:.2em;

}



.amount {

width:5.5em;

}



#reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {

margin:.5em 1em 0 0 ;

}



#cartImage {

margin:.5em 1em;

}



.attribImg {

width:20%;

margin:.3em 0;

}



.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatugreen, .centerBoxContentsNew {

margin:1em 0;

}



.centerBoxContentsProducts {

margin:0 auto;

text-align:center;

width:95%

}



h3.leftBoxHeading, h3.rightBoxHeading {

font-size:1.1em;

font-weight:normal;

height:1.5em;

padding:.2em 0 0 0;

}



h2.centerBoxHeading {

margin:5px auto;

padding:.5em 0;

text-align:center;

border:1px solid #bababa;

line-height:normal;

width:100%;

}



.leftBoxHeading, .rightBoxHeading {

}



.sideBoxContent {

font-size:1.1em;

padding:5px;

}



.sideBoxContent ul {

text-align:left;

list-style-type:none;

padding:0 0 0 10px!important;

margin:0!important;

}



.sideBoxContent li {

}



#categoriesContent, #documentcategoriesContent {

text-align:left;

padding-left:10px;

}



.centegreenContent, TH, #cartEmptyText, #cartBoxGVButton, #cartBoxEmpty, #cartBoxVoucherBalance, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCgreenits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, .cartTotalsDisplay, #cartBoxGVBalance, .leftBoxHeading, .centerBoxHeading,.rightBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatugreen, .centerBoxContentsNew, .gvBal, .attribImg {

text-align:center;

}



.productListing-data img {

padding:10px;

}



#upProductsHeading {
text-align:left;
}

#upDateHeading {
text-align:right;
}

/*misc*/
.back {
float:left;
}

.forward, #shoppingCartDefault #PPECbutton {
float: right;
}

.bold {
font-weight:bold;
}

.rowOdd {
height:1.5em;
vertical-align:top;
}

.rowEven {
height:1.5em;
vertical-align:top;
}

.hiddenField {
display:none;
}

.visibleField {
display:inline;
}

#accountLinksWrapper li {
padding:.5em 0;
display:block;
list-style:none;
}

.accountTotalDisplay, .accountTaxDisplay {
width:20%;
text-align:right;
}

.accountQuantityDisplay {
width:10%;
vertical-align:top
}

TR.tableHeading {
height:2em;
}

#siteMapList {
width:90%;
float:right;
}

.ratingRow {
margin:1em 0 1.5em 0;
}

LABEL#textAreaReviews {
font-weight:normal;
margin:1em 0;
}

.information {
padding: 10px 3px;
line-height: 150%;
}

.smallProductImage {
padding:1em;
}

#sendSpendWrapper {
border:1px solid #cacaca;
float:right;
margin:0 0 1em 1em;
}

.floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #navEZPagesTOCWrapper {
width:46%;
}

/* css for product image drop shadow and border. To disable the drop shadow and border, simply delete or comment out this section */

#productMainImage {
float:left;
background: url("../images/shadowAlpha.png") no-repeat bottom right !important;
background: url("../images/shadow.gif") no-repeat bottom right;
margin: 10px 0 0 10px !important;
margin: 10px 0 0 5px;
}

#productMainImage img {
display: block;
position: relative;
background: #ffffff;
margin: -3px 6px 6px -3px;
border: 1px solid #a9a9a9; /* defines the border for the product image. To remove the border delete or comment out this line, AND padding: 4px; below */
padding: 4px;
}

/* end css for product image drop shadow */

Any suggestion on what to change to fix the sideboxes expanding into the background?

Thanks
Ernie

[jettrue]

Hi!

I think this has been asked before but I cannot find it anywhere.

I am having an issue with CZ displaying in a clients website.

The RHS sideboxes extend into the background and the header bar seems to be on a separate line than the search box at the far left.

Here is an image of of the RHS sideboxes and you can see the end of the word Checkout is on a second line at the top.



I have set the width of the template as 1000 px in the stylesheet.css which is below in case I need to edit that!!!



Any suggestion on what to change to fix the sideboxes expanding into the background?

Thanks
Ernie

Please never post your entire stylesheet. I need to see an actual link.

What did you set your sidebox widths to in your admin? If it's anything other than 150px, then read the readme.txt on what you need to do if you change the sidebox widths.

Also, try reuploading the original version of my stylesheet.css, and see if the issue goes away.

[ruready]

I had this problem and couldn't figure it out. Turns out, when you set the sidebox size in admin you must include the "px" and not just type in the size -> do this 150px -> not 150.

[indigo-island]

Hi

I've been trying so hard not to post - but am going round in circles now and have no idea what I'm doing... so any help would be really gratefully received!

I had been using Cherry Zen for a couple of years without problem, before I decided to make some more modifications to my previous modifications (famous last words!)

The home page content is in a table which is 600px wide
It's centered on IE8
but pushed to the left on Firefox

I've fiddled and fiddled with all the width settings and seem to be able to get it right in either FF or IE but not both.

My site is http://www.indigo-island.com/catalog

and I'll love you for ever if you can tell me what I've done - as I've utterly lost the plot!

[orange_juice]

Hallo! I am a potential new user of zen cart. I am currently developing my cherry zen eshop at my local computer and I would like to ask the following question:

The width of the site is fluid. Can I make the height of the site fluid as well?

What I managed to do until now is to define a fixed height for my site with the following lines at stylesheet.css: (My lines are the GT marked)

.contentWrap {
	padding: 5px 0 5px 5px;
	height: 700px; /*GT*/
	overflow-x: hidden;/*GT*/
    	overflow-y: auto;/*GT*/
}

Although this is close to what I need, this code does not give a "fluid" solution.

I have also found this post which tries to give a solution but I did not manage to get any result.
http://www.zen-cart.com/forum/showthread.php?p=715983

Could you please help me in this issue?

Kind regards,
orange_juice

[jrim]

Hey there :)

Just installed 1.3.8 and your awesome template - thanks!

But there's a small problem... the website displays links below the banner! Categories. I can't figure out how to disable them and I've searched to no end. here's a link to my site: http://dfdancewear.com/shop/

How do I remove those links? They look really out of place.

[jettrue]

Hey there :)

Just installed 1.3.8 and your awesome template - thanks!

But there's a small problem... the website displays links below the banner! Categories. I can't figure out how to disable them and I've searched to no end. here's a link to my site: http://dfdancewear.com/shop/

How do I remove those links? They look really out of place.

I can't see what you're referring to since you don't have the cherry zen template on right now. I think you might be referring to the Categories Tabs menu, which you turn of in your admin, under "Configuration", "Layout Settings"