Nifty Zen Template - Rounded Corners without images!

[areyousure]

sorry that this is delayed due to some pc hardware issue.

now it looks like this, scrshot:

and i prefer the upper approach(html_header.php). because this way the inner wrapper will not be so jam packed with links.

that said, i may as well put the links inside wrapper if i have a horizontal flyout menu implemented.

[crazycucumber]

thanks for a new style of template to play with , can anyone tell me how to split the boxes apart a little .

Ive tried padding the bottom of .SideBoxContainer but it doesn't seem to work . I just want the sideboxes to be seperated with "white space"

I know its just a CSS tweak somewhere , but cant figure it at the moment.

Cheers

[jettrue]

thanks for a new style of template to play with , can anyone tell me how to split the boxes apart a little .

Ive tried padding the bottom of .SideBoxContainer but it doesn't seem to work . I just want the sideboxes to be seperated with "white space"

I know its just a CSS tweak somewhere , but cant figure it at the moment.

Cheers

There is no .SideBoxContainer tag, as far as I know,
Also, try it with a margin instead:
.sideBoxContent {
padding: 0.4em;
margin-bottom:2em;
}

[erwin208]

I love this theme, but some customisation is a problem for me.
I want a fixed width cause I want a full size backgroundpicture in the whole header. So covering the whole blue header area. I guess I need a split image (behind the NIFTZEN logo and the tabs/search). I don't use the categories in the header and my niftyzentemplate is centered.
Please give me some directions for the fixed width and headerbackgroundimage.

nb. NiftyZen templates works well with vs. 1.3.6

[bfwdesigns]

I am using 1.3.6 and followed the directions to a tee ( I believe) to center the nifty template but it still wont work.. here is what I have for the css:
/**
* Main CSS Stylesheet
*
* @package templateSystem
* @copyright Copyright 2003-2005 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: stylesheet_new.css nifty_zen v1.2 2006-Sep-10 jettrue $
*/

/* Site centering instructions for this template are found under #outermainWrapper*/

* {
margin:0;
padding:0;
}

body {
font-family: arial, verdana, helvetica, sans-serif;
font-size: 79.5%;
color: #000000;
margin:30px 0;
background:#fff;
}

a img {
border: none;
}

a:link, #navEZPagesTOC ul li a {
color: #333;
text-decoration: none;
}

a:visited {
color: #666;
text-decoration: none;
}

a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover {
color: #000;
}

a:active {
color: #000;
}

h1 {
font-size: 1.4em;
}

h2 {
font-size: 1.3em;
}

h3 {
font-size: 1.2em;
}

h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .larger{
font-size: 1.1em;
}

.biggerText {
font-size: 1.2em;
}

h1, h2, h3, h4, h5, h6 {
margin: 0.3em 0;
}


CODE {
font-family: arial, verdana, helvetica, sans-serif;
font-size: 1em;
}

FORM, SELECT, INPUT {
font-size: 1em;
margin: 2px;
}

.navMainSearch INPUT {
font-size:11px;
}

form {
display:inline;
margin-top:0px;
margin-bottom:0px;
}

TEXTAREA {
margin: auto;
display: block;
width: 95%;
}

input:focus, select:focus, textarea:focus {
background: #F0F8FF;
}

FIELDSET {
padding: 0.5em;
margin: 0.5em 0em;
border: 1px solid #cccccc;
}

LEGEND {
font-weight: bold;
padding: 0.3em;
}

LABEL, h4.optionName {
line-height: 1.25em;
padding: 0.1em;
}

LABEL.checkboxLabel, LABEL.radioButtonLabel {
font-size: 0.95em;
margin: 0.2em 0.5em;
}

#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
float: left;
}

#logo {
margin-left:5px;
}

LABEL.inputLabel {
font-size: 0.95em;
width: 10em;
float: left;
}

#checkoutPayment .inputLabel {
width:85%;
}

LABEL.inputLabelPayment {
width: 15em;
float: left;
}

LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {
width: 12em;
float: left;
}

P, ADDRESS {
padding: 0.5em;
}

ADDRESS {
font-style: normal;
}

.clearBoth {
clear: both;
}

HR {
height: 1px;
margin-top: 0.5em;
border: none;
border-bottom: 1px solid #9a9a9a;
}

/*warnings, errors, messages*/

.messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {
line-height: 1.8em;
padding: 0.2em;
border: 1px solid #000000;
}

.messageStackWarning, .messageStackError {
background-color: #933;
color: #ffffff;
}

.messageStackSuccess {
background-color: #99FF99;
color: #000000;
}

.messageStackCaution {
background-color: #FFFF66;
color: #000000;
}

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
}

#navColumnOneWrapper, #navColumnTwoWrapper{
background:#F0FAFD;
}

#tagline {
color:#333;
font-size: 1.4em;
text-align : center;
padding:20px 5px 0 0;
}

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

.floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #csNotifications, #navEZPagesTOCWrapper {
margin: 10px 0px;
width: 100%;
}

.wrapperAttribsOptions {
margin: 0.3em 0em;
}

/*navigation*/

.navSplitPagesResult {
margin: 0.5em;
font-size: 0.9em;
}

.navSplitPagesLinks {
margin: 0.5em;
font-size: 0.9em;
}

.navNextPrevCounter {
font-size: 0.9em;
}

.navNextPrevList {
display: inline;
white-space: nowrap;
padding: 0.5em 0em;
list-style-type: none;
}

#navMainWrapper {
color: #000;
width: 100%;
height: 25px;
}

#navCatTabsWrapper {
color: #000;
width: 100%;
line-height:1.3;
}

/*This section controls the top tab links */
div#navMain {
float:left;
height:0;
background: #93D6E8; /*background color behind tabs, should match logo color (blue default)*/
}

ul#back,ul#back li {
list-style-type:none;
}

ul#back {
margin-left: 1.5em;
font-size:13px;
}

ul#back li {
float:left;
margin-right: 3px;
text-align: center;
}

ul#back a {
float:left;
width: 7em;
padding: 5px;
background: #666;
text-decoration:none;
color: #fff; /*color of top tabs and text color (grey default)*/
}

ul#back a:hover {
background: #933;
color: #000; /*color of top tabs and text color when you hover over them (red default) */
}

/*end top tab links */

/*wrappers - page or section containers*/

#outermainWrapper {
background-color: #4B4B4B; /*this controls the color of the small outermost strip of background border (grey border default)*/
width: 65em;
max-width: 1024px;
padding:8px;
text-align: center;
margin:0 auto;
/*text-align:center;
margin:0 auto;
padding:8px;*/ /*to center this site, uncomment these, and erase the padding:8px 8px 8px 0; above. Then open up includes/templates/nifty_zen/jscript/jscript/niftyalayout.js and follow instructions there*/
}

#mainWrapper {
background-color: #93D6E8; /*this controls the color of the inner rounded edges, both top right and bottom right (blue default)*/
text-align: left;
width: 64.8em;
max-width:1019px;
}

#contentMainWrapper {
border-top:1em solid #933; /*color of border below the tabs (red default)*/
color:#000;
background:#fff;
font-size:110%;
position:relative;
}

#navSuppWrapper {
border-top:1em solid #933; /*color of border above the footer (red default)*/
color:#fff;
}

#navSupp {
background:#93D6E8; /*color of footer where the Home link is (blue default)*/
}

#navColumnOne {
padding: 0;
background:#F0FAFD; /*background color of left sidebox (light blue default */
border-right:5px solid #333; /* left sideboxes border (default grey) */
}

#navColumnTwo {
padding: 0;
background:#F0FAFD; /*background color of right sidebox (light blue default */
border-left:5px solid #333; /* right sideboxes border (default grey) */
}

h3.leftBoxHeading, h3.rightBoxHeading{
background:#93D6E8; /* background color behind sidebox heading (blue default) */
padding:0;
margin-top:3px;
width:100%;
}

h3.rightBoxHeading a:hover, h3.rightBoxHeading a, h3.leftBoxHeading a:hover, h3.leftBoxHeading a{
color: #000; /* text color of sidebox heading */
text-decoration: none;
}

#navSupp ul, #navCatTabs ul {
padding: .2em .5em;
list-style-type: none;
text-align: center;
}

#navSupp ul li, #navCatTabs ul li {
display: inline;
}

#navSupp ul li a{
text-decoration: none;
padding: 0 0.5em;
color: #fff;
white-space: nowrap;
}

#navCatTabs ul li a {
text-decoration: none;
padding: 0 0.5em;
color: #000;
font-weight:bold;
white-space: nowrap;
}

#navCatTabs ul li a:HOVER, #navEZPagesTop a:hover{
color: #fff;
font-weight:bold;
}

#navEZPagesTOCWrapper {
font-weight: bold;
float: right;
height: 1%;
border: 1px solid #000000;
}

#navEZPagesTOC ul {
padding: 0.5em 0em;
list-style-type: none;
line-height: 1.5em;
}

#navEZPagesTOC ul li {
white-space: nowrap;
}

#navEZPagesTOC ul li a {
padding: 0 0.5em;
}

#navMainSearch, #navCategoryIcon, #indexProductListCatDescription {
margin:0 0.5em;
}

#navEZPagesTop {
font-size: 1em;
font-weight: bold;
margin-bottom:.5em;
padding: .5em 2em;
background: #93D6E8;
}

#navBreadCrumb {
font-size: 1em;
font-weight: bold;
padding: 0.5em;
background:#fff;
}

.leftBoxContainer {
padding:0;
}

/*The main content classes*/

#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
vertical-align: top;
}

#productDescription, .shippingEstimatorWrapper {
padding: 0.5em;
}

.alert {
color: #933;
margin-left: 0.1em;
font-size: 0.9em;
}

.advisory {}

.important {
font-size: 1.1em;
}

.notice {}

.rating{}

.gvBal {
float: right;
}

.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;
}

.centerColumn {
line-height:1.2;
}

.smallText, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP {
font-size: 0.9em;
}

#siteinfoLegal {
padding:10px;
}

/*Shopping Cart Display*/

#cartAdd {
float: right;
text-align: center;
margin: 1em;
border: 1px solid #000000;
padding: 1em;
}

.cartTableHeading TH {
border-bottom: 1px solid #cccccc;
}

.cartTableHeading, #cartSubTotal {
background-color: #e9e9e9;
height: 2.2em;
}

#cartSubTotal {
border-top: 1px solid #cccccc;
font-weight: bold;
text-align: right;
line-height: 2.2em;
padding-right: 2.5em;
}

.cartProductDisplay, .cartUnitDisplay, .cartTotalDisplay, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartInstructionsDisplay, .cartTotalsDisplay {
padding: 0.5em 0em;
}

.cartUnitDisplay, .cartTotalDisplay {
text-align: right;
padding-right: 0.2em;
}

#scUpdateQuantity {
width: 2em;
}

#cartBoxEmpty, #cartBoxVoucherBalance {
font-weight: bold;
}

.cartQuantity {
width: 4.7em;
}

.cartNewItem {
color: #33CC33;
position: relative; /*do not remove-fixes stupid IEbug*/
}

.cartOldItem {
color: #660099;
position: relative; /*do not remove-fixes stupid IEbug*/
}

.cartBoxTotal {
text-align: right;
font-weight: bold;
}

.cartRemoveItemDisplay {
width: 3.5em;
}

#cartAttribsList {
margin-left: 1em;
}

.cartAttribsList {
margin-left: 1em;
}

.normalprice, .productSpecialPriceSale {
text-decoration: line-through;
}

.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {
color: #933;
}

#cartBoxListWrapper ul, #ezPageBoxList ul {
list-style-type: none;
}

#cartBoxListWrapper li, #ezPageBoxList li, .cartBoxTotal {
padding: 0.2em 0em;
}

.orderHistList {
margin: 1em;
padding: 0.2em 0em;
}

.totalBox {
width: 5.5em;
text-align: right;
padding: 0.2em;
}

.lineTitle, .amount {
text-align: right;
padding: 0.2em;
}

.amount {
width: 5.5em;
}

/*Image Display*/

#productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
margin: 0em 1em 1em 0em ;
}

.categoryIcon {}

#cartImage {
margin: 0.5em 1em;
}

/*Attributes*/

.attribImg {
width: 20%;
margin: 0.3em 0em;
}

.attributesComments {}

.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
margin: 1em 0em;
}

h2.centerBoxHeading, .productListing-rowheading {
font-size: 1em;
color: #000;
padding: 0.5em 0.2em;
border-bottom: 1px solid #9a9a9a;
}

.centerBoxWrapper, .tabTable {
padding: 0px;
height: 1%; /*do not remove- IEhack*/
border: 1px solid #9a9a9a;
margin-bottom: 1em;
}

.sideBoxContent {
padding: 0.4em;
}

.rightBoxContent {
margin-bottom: 1em;
}

.centeredContent, TH, #cartEmptyText, #cartBoxGVButton, #cartBoxEmpty, #cartBoxVoucherBalance, #navNextPrevWrapperTop, #navNextPrevWrapperBottom, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, .cartTotalsDisplay, #cartBoxGVBalance, .leftBoxHeading, .rightBoxHeading, .centerBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {
text-align: center;
}

#bestsellers .wrapper {
margin: 0em 0em 0em 1.5em;
}

#bestsellers ol {
padding: 0;
margin-left: 1.1em;
}

#bestsellers li {
padding: 0;
margin: 0.3em 0em 0.3em 0em;
}

#upProductsHeading {
text-align: left;
}

#upDateHeading {
text-align: right;
}

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

.forward {
float: right;
}

.bold {
font-weight: bold;
}

.rowOdd {
background-color: #E8E8E8;
height: 1.5em;
vertical-align: top;
}

.rowEven {
background-color: #F0F0F0;
height: 1.5em;
vertical-align: top;
}

CAPTION {
/*display: none;*/
}

#myAccountGen li, #myAccountNotify li {
}

.accountTotalDisplay, .accountTaxDisplay {
width: 20%;
text-align: right;
/*vertical-align: top*/
}

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

TR.tableHeading {
background-color: #cacaca;
height: 2em;
}

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

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

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

#popupShippingEstimator, #popupSearchHelp, #popupAdditionalImage, #popupImage, #popupCVVHelp, #popupCouponHelp, #popupAtrribsQuantityPricesHelp, #infoShoppingCart {
background-color: #ffffff;
}

and the jscript:

/*to center the site, change
Nifty("div#mainWrapper", "big right");
Nifty("div#outermainWrapper", "big right");

to

Nifty("div#mainWrapper", "big");
Nifty("div#outermainWrapper", "big");
*/

NiftyLoad=function(){
Nifty("ul#back a","small transparent top");
Nifty("div#mainWrapper", "big");
Nifty("div#outermainWrapper", "big");
}

did I screw up somewhere?

Thanks in advance!

[jettrue]

I am using 1.3.6 and followed the directions to a tee ( I believe) to center the nifty template but it still wont work.. here is what I have for the css:

did I screw up somewhere?

Thanks in advance!

I just pasted your entire stylesheet into my 1.3.6 test site, and it centered it just fine. What it didn't do though, is create the correct corners. Because as my instructions stated, you need to:

Then open up includes/templates/nifty_zen/jscript/jscript/niftyalayout.js and follow instructions there*/

Take this:

and the jscript:

/*to center the site, change 
Nifty("div#mainWrapper", "big right");
Nifty("div#outermainWrapper", "big right");

to

Nifty("div#mainWrapper", "big");
Nifty("div#outermainWrapper", "big");
*/

NiftyLoad=function(){
Nifty("ul#back a","small transparent top");
Nifty("div#mainWrapper", "big");
Nifty("div#outermainWrapper", "big");
}

off of the stylesheet, and open up the correct file for the jscript. That section doesn't belong in the stylesheet at all.

[bfwdesigns]

ok, it worked great! Thank you!!!

I did have 2 questions:

1) How do you get rid of the tagline? It this just any other template in the english.php file?

2) Also, if I just wanted to have 1 column (along the left side) and get rid of the second column and the black line or whatever it is that separates the center from right.. would this be possible? If so, what would you do? code? css?

Thanks in advance!

[jettrue]

ok, it worked great! Thank you!!!

I did have 2 questions:

1) How do you get rid of the tagline? It this just any other template in the english.php file?

2) Also, if I just wanted to have 1 column (along the left side) and get rid of the second column and the black line or whatever it is that separates the center from right.. would this be possible? If so, what would you do? code? css?

Thanks in advance!

1) yes, this is done through the language files. A search of the forum will have complete instructions on doing that.

2) This is done through the admin, under "Tools" and "Layout Settings".

[bfwdesigns]

Thanks for the reply, but I know how to shut off the side categories but I think the right column is part of the design because when I downloaded it, it already had a left, center and right column without me having any categories...

[jettrue]

Thanks for the reply, but I know how to shut off the side categories but I think the right column is part of the design because when I downloaded it, it already had a left, center and right column without me having any categories...

I meant to say go to "Configuration" then "Layout Settings".