Simple Zen Template - Support Thread

re: the alignment...

go through the files both in the "simple_zen" templates folder, and the "default_template" templates folder, and especially on the tpl_(problempage) and the tpl_main_page, and look for instances of the following :

<br class="clearBoth" />    OR <br style="clear:both;" />

change them to ```

that will fix a lot of little layout problems.

also make sure that any IE hacks used in the stylesheet use the right syntax.

as far as font sizes, see what divs the fonts in question are located in, or what styles are being applied, and then check your stylesheet to make changes to those particular ones.

I have been sitting here reading up again as usual trying desperately to get rid of the dreary gray background from my simple-zen template without any luck...

I have uploaded my background image as both a gif and jpg - neither worked - to the /includes/templates/simple_zen/images folder as well as the main /images folder on the root directory...nada...

I changed my stylesheet_new.css "body" and "main wrapper" sections trying to add background images but still no luck..I have read numerous times about replies on this but the answers never seem to work for me..I must editing my css wrong somewhere or uplodaing the files to the wrong spot...

Please help when you get a sec...

I just noticed also I must have accidentally changed something I should not have as at the top left hand corner where HOME and LOG IN are the words LOG In seem to be chopped off now...geesh...I might destroy this thing yet!

Thanks,
Moy
www.bydesigncreations.ca

BDCreations:

I have been sitting here reading up again as usual trying desperately to get rid of the dreary gray background from my simple-zen template without any luck...

I have uploaded my background image as both a gif and jpg - neither worked - to the /includes/templates/simple_zen/images folder as well as the main /images folder on the root directory...nada...

I changed my stylesheet_new.css "body" and "main wrapper" sections trying to add background images but still no luck..I have read numerous times about replies on this but the answers never seem to work for me..I must editing my css wrong somewhere or uplodaing the files to the wrong spot...

Please help when you get a sec...

I just noticed also I must have accidentally changed something I should not have as at the top left hand corner where HOME and LOG IN are the words LOG In seem to be chopped off now...geesh...I might destroy this thing yet!

Thanks,
Moy
www.bydesigncreations.ca

Can I see a link to the store, please?

to change the page background (the part OUTSIDE the main body of the store) look at the body section in the style sheet... change the following value to what color you want or add an image as shown in the next example..

body {background:#999;}

to change the store background (the part inside the store boundaries) change the following:
(you can use the color value, or add the background image, or both... )

#mainWrapper {background: #fdfde9 url("../images/your_background.gif"); } 

Is this the wrapper to change to add image

/wrappers - page or section containers/
div#mainWrapper {
text-align: left;
width: 750px;
vertical-align: top;
background:#fff;
border:5px solid #333;
}

Ron

RKB:

Is this the wrapper to change to add image

/wrappers - page or section containers/
div#mainWrapper {
text-align: left;
width: 750px;
vertical-align: top;
background:#fff;
border:5px solid #333;
}

Ron

If you want an image for the whole site, do that with the body tag in the css.

Yes, that is the tag to change for the main wrapper... you can see the effect if you take a look at my site.... I have a background image in the main wrapper, and a background color in the body tag.

grayceworks:

Yes, that is the tag to change for the main wrapper... you can see the effect if you take a look at my site.... I have a background image in the main wrapper, and a background color in the body tag.

But didn't he say he wanted a background image on the outermost part of the screen? In the outer grey portion? That would be in the BODY tag. You're confusing me here, LOL, by answering the same question I answer but differently. I'm losing track of what the question was. :lol:

He didn't exactly say which part, but I assumed it was the "outside" part due to the mention of it being the grey section.

He had mentioned trying BOTH the "body" tag, and the "main wrapper" tag, so I gave examples of both, to show which sections of each would be changed, depending on the effect he wanted, with explanations of which tag changed which part of the page...

Since he couldn't get his image to show on either tag, I showed an example of how an image would be set as the background, in case it was something in the way he was coding it...

If he wants the image in the body tag, he can just copy what the format is from the second example, as I had mentioned in my original post to him. He was checking to make sure he was looking at the right "body" tag.

winks He had asked me to clarify the comment I made earlier, so I did. :lol:

BDCreations:

I have been sitting here reading up again as usual trying desperately to get rid of the dreary gray background from my simple-zen template without any luck...

I have uploaded my background image as both a gif and jpg - neither worked - to the /includes/templates/simple_zen/images folder as well as the main /images folder on the root directory...nada...

I changed my stylesheet_new.css "body" and "main wrapper" sections trying to add background images but still no luck..I have read numerous times about replies on this but the answers never seem to work for me..I must editing my css wrong somewhere or uplodaing the files to the wrong spot...

Please help when you get a sec...

I just noticed also I must have accidentally changed something I should not have as at the top left hand corner where HOME and LOG IN are the words LOG In seem to be chopped off now...geesh...I might destroy this thing yet!

Thanks,
Moy
www.bydesigncreations.ca

If anyone can so help me set ezpages up with the simple zen le me know. i've been lurking to find the answer now for a few hours.

I can't edit my previous post for some reason. Ok, I tried this method to remove the 3 icons in the header, by commenting it out using an additional CSS property. It's not working though in any of my browsers. I cleared their cache too.

Originally Posted by Christian111 View Post
Hi,

I use the simple Zen 1.8 on my Zen Cart 1.3.5 (German version). I want to remove the shopping cart/contact us/my account links from the header. So I comment the "Top Nav Links with Image and link only" in the css file out but the links are still there.

You can see it here: http://lm.teestube-online.de

Anyone an idea what I have to do to remove the links?

Thanks and greats

Christian
Hi Christain

The links are part of the HTML generated by your common/tpl_header.php file. The CSS section that commented out styles these links, so all you have removed is the styling rather than the links themselves. To remove the liks you would need either to comment them out in the tpl_header.php file, or you could hide them by adding the following to your stylesheet
Quote:
#navMain {display:none}

I'd like to add this in case anyone needs to know: I was looking for the way to remove the icons in the header and their links. A friend with more knowledge said do this in the stylesheet for the template:
#tagline {display:none;}

this guy just removes the top bar login things:
#navMain {display:none}

I upgraded from Simple Zen 1.8 to 2.0 today. It looks fantastic! So much cleaner and tighter.

However, I have some display issues, which I have spent today trying to figure out, but can't seem to track down:

in all browsers:

1. a small "s" in the lower left hand corner - appeared when I added:

#navMainWrapper {
	background: url(../images/gradient.gif) repeat-x;
	font-weight: bold;
	color: #fff;
	width: 100%;
	font-size:1em;
	border-bottom:1px solid #333;
	height:34px;
	}

2. the search sidebox is now attached to the shopping cart sidebox (I have pages with just the shopping cart sidebox-now both appear)

in IE6:

3. The top header has the lower halves of letters missing: the "g" in log in and the "p"'s in shopping.

in Safari:

4. shipping insurance box is out of alignment (in check out)

On going issues before the upgrade:

in Safari:

1. My account bullet points running into the sideboxes
2. My wish list bullet points running into the sideboxes (still exists even with this code added)```php

3. In category sidebox: large gap under last category before Specials Link (could be BetterCategories mod-not sure)

in IE6

4. My wish list bullet points running into the sideboxes (did not exist pre-up grade)

in FF:

5. I deleted some category headings ie: "Search" from the english file. In FF an Empty Space remains there (might have to live with this one?)

And a FF warnings which I don't know if important, or not:

Warning: Error in parsing value for property 'font'. Declaration dropped.
Source File: https://secure.xxxx.com/includes/templates/simple_zen/css/stylesheet_new.css
Line: 245

dharma:

I upgraded from Simple Zen 1.8 to 2.0 today. It looks fantastic! So much cleaner and tighter.

However, I have some display issues, which I have spent today trying to figure out, but can't seem to track down:

in all browsers:

1. a small "s" in the lower left hand corner - appeared when I added:

LOL, I'm trying to imagine a scenario where that chunk of css could cause an s, and it's not working out for me. :D When I view your source i see the letter "s" just after this section:

<!--bof-navigation display -->
<div id="navSuppWrapper">s

Check your common/tpl_footer.php file, you may have accidentally added a "s" in there.

dharma:

2. the search sidebox is now attached to the shopping cart sidebox (I have pages with just the shopping cart sidebox-now both appear)

I'm not sure what you mean by the above. Attached?

dharma:

in IE6:

3. The top header has the lower halves of letters missing: the "g" in log in and the "p"'s in shopping.

Try changing the following section to this:

#navMain ul {
padding-top:.5em;
list-style-type: none;
text-align: center;
line-height: 2em;
}

dharma:

in Safari:

4. shipping insurance box is out of alignment (in check out)

I think I see what you mean, but I don't see that as an alignment problem, the selection button is just below the text.

dharma:

---

On going issues before the upgrade:

in Safari:

1. My account bullet points running into the sideboxes
2. My wish list bullet points running into the sideboxes (still exists even with this code added)```php

.centerColumn ul {padding-left:20px;}

dharma:

3. In category sidebox: large gap under last category before Specials Link (could be BetterCategories mod-not sure)

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

dharma:

in FF:

5. I deleted some category headings ie: "Search" from the english file. In FF an Empty Space remains there (might have to live with this one?)

#searchHeading {height:0}

dharma:

---

And a FF warnings which I don't know if important, or not:

Warning: Error in parsing value for property 'font'. Declaration dropped.
Source File: https://secure.xxxx.com/includes/templates/simple_zen/css/stylesheet_new.css
Line: 245

You can ignore that, its not important.... however there is a way to stop it... I can't recall exactly what the issue with that was, I either addressed it with this template or another, I'll post when I remember where that can be adjusted. ;-)

dharma:

And a FF warnings which I don't know if important, or not:

Warning: Error in parsing value for property 'font'. Declaration dropped.
Source File: https://secure.xxxx.com/includes/templates/simple_zen/css/stylesheet_new.css
Line: 245

Try removing:
font-size:1em;

from #navSuppWrapper

I am a SHE btw :)

I am still not getting anywhere with changing the horrid gray background...although not for lack of trying...

I want to add a simple faintly dotted background tile to replace the gray on the outer side of main box..if this makes sense..not the background of the main site area...

Here is my current code in the body:

body {
margin: 0 auto;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 78.5%;
background: url("../images/bluedots.jpg");
padding-top:25px;
}

What is wrong here...? Still seeing gray....

Thanks,
Moy
www.bydesigncreations.ca/index.php

BDCreations:

I am a SHE btw :)

I am still not getting anywhere with changing the horrid gray background...although not for lack of trying...

I want to add a simple faintly dotted background tile to replace the gray on the outer side of main box..if this makes sense..not the background of the main site area...

Here is my current code in the body:

body {
margin: 0 auto;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 78.5%;
background: url("../images/bluedots.jpg");
padding-top:25px;
}

What is wrong here...? Still seeing gray....

Thanks,
Moy
www.bydesigncreations.ca/index.php

Thanks for the compliment. Anyway, I guess you figured it out, because when I go to your site, I don't see "horrid" gray, I see polkadots.

I finally did get it - no idea what was different this time but obviously something was wrong with my css...now I can do it I can find a background image I like to match colours!

Can you still tell me why I can no long see the tail of the "G" in LOG IN at the top of the screen???

Or how about where to change the hover effects to a HIGHLIGHT on the leftside categories menus...or make them into a bullet list as others have done rather than the current line setup??? :)

www.bydesigncreations.ca/index.php

Thanks,
Moy :)

Wow - fixed the MISSING G myself...still curious about where to change the hover effects to a HIGHLIGHT on the leftside categories menus...or make them into a bullet list as others have done rather than the current line setup??? :)

Or how about removing righthand colum altogether as my prodcuts seem cramped as they are now in the small center column...Like in the sample of the layout you show in your main inttro (it shows a large left column and smaller category right column..but only 2 not 3 as I have now).

I DO loooooove the template and ZenCart BTW...just really not an easy thing for a die-hard HTML coder to wrap their mind around this CSS stuff... COMPLETELY DIFFERENT!!!!

Good Morning,
Just to let you know that your Text looks fine here, I checked it using both Firefox and IE

Ron