Apple Zen Support Thread

[jettrue]

Hmmm... that would mean that there is a missing </div> in my header.php as well?

Ack! NO, that does not mean you have a missing div. The same issue can have more than one cause.

The way I have includes/languages/english/apple_zen/header.php is the way it is supposed to be. There only needs to be a space between the " ' " for HEADER_LOGO_WIDTH, and HEADER_LOGO_HEIGHT. HEADER_ALT_TEXT and HEADER_SALES_TEXT do NOT have to be blank. You can add back your alt text, and if you want to have text to the right of your logo, you can add sales_text. Of course if you have a wide logo, you should have the sales text blank. Here is the original header.php language file:

// added defines for header alt and text
  define('HEADER_ALT_TEXT', 'Powered by Zen Cart :: The Art of E-Commerce');
  define('HEADER_SALES_TEXT', 'To change any of the site colors, open up includes/templates/apple_zen/css/stylesheet.css. To overwrite your own logo, upload your logo.gif to includes/templates/apple_zen/images/');
  define('HEADER_LOGO_WIDTH', ' ');
  define('HEADER_LOGO_HEIGHT', ' ');
  define('HEADER_LOGO_IMAGE', 'logo.gif');

If the space are removed for logo_width and logo_height, then your logo will expand to its "real" dimensions (because then zen cart specifies its height and width-- putting the space stops zen cart from adding the height and width). SO, IF you happen to have a tall logo, then sure, you wouldn't see that striped background, because your logo would be on top of it obscuring it. However bradymc's issue WAS caused by a missing div. Yours was not.

Phew. Hope that is clear now.

Thanks for the compliment on the template, by the way.

[bradymc]

I, too, would like to compliment your template, Jettrue. I guess I got lucky because yours was the 2nd template that I downloaded. After I stumbled upon a template browser for all of the templates available on zen's site, I was dissappointed by the lack of originality. Most of them seemed like they were just some color variation of the original. But Apple_Zen is refreshing. Thanks for sharing your talents and showing the rest of us how templates ought to be made.

[jettrue]

I, too, would like to compliment your template, Jettrue. I guess I got lucky because yours was the 2nd template that I downloaded. After I stumbled upon a template browser for all of the templates available on zen's site, I was dissappointed by the lack of originality. Most of them seemed like they were just some color variation of the original. But Apple_Zen is refreshing. Thanks for sharing your talents and showing the rest of us how templates ought to be made.

You're very welcome. I like it too.

[ghostcorps]

FIstly.. I must heap the obligatory "this roXors!!" compliment.. as has been said a few time. this is such a professional and complete theme. I saw it and there was no further looking needed.

thanks :)


I am however, having a very odd issue. When I originally added the template, I simply copied my logo and all was happy. But, after a few hits & miss's modification wise. My logo decided to take up the full page. I couldn't figure out why so I dumped the template and started again. Yet now the logo insists on being twice is actual size!

This is the logo as it should be http://www.fleshmetal.com.au/137/inc...mages/logo.gif

But if you go to my site www.fleshmetal.com.au/137 you can see it is mutated.

My header is as follows:

// added defines for header alt and text
define('HEADER_ALT_TEXT', 'Fleshmetal.com.au');
define('HEADER_SALES_TEXT', 'Fleshmetal.com.au');
define('HEADER_LOGO_WIDTH', ' ');
define('HEADER_LOGO_HEIGHT', ' ');
define('HEADER_LOGO_IMAGE', 'logo.gif');

Yet if I remove the spaces, or try to hard-code the size it flattens to the correct height, and stays double width. I have cleared the cache to be sure. But, it is still playing havoc with my sense of right and wrong.

Can you suggest where I am going wrong?

Thanks :)

[jettrue]

FIstly.. I must heap the obligatory "this roXors!!" compliment.. as has been said a few time. this is such a professional and complete theme. I saw it and there was no further looking needed.

thanks :)


I am however, having a very odd issue. When I originally added the template, I simply copied my logo and all was happy. But, after a few hits & miss's modification wise. My logo decided to take up the full page. I couldn't figure out why so I dumped the template and started again. Yet now the logo insists on being twice is actual size!

This is the logo as it should be http://www.fleshmetal.com.au/137/inc...mages/logo.gif

But if you go to my site www.fleshmetal.com.au/137 you can see it is mutated.

My header is as follows:

// added defines for header alt and text
define('HEADER_ALT_TEXT', 'Fleshmetal.com.au');
define('HEADER_SALES_TEXT', 'Fleshmetal.com.au');
define('HEADER_LOGO_WIDTH', ' ');
define('HEADER_LOGO_HEIGHT', ' ');
define('HEADER_LOGO_IMAGE', 'logo.gif');

Yet if I remove the spaces, or try to hard-code the size it flattens to the correct height, and stays double width. I have cleared the cache to be sure. But, it is still playing havoc with my sense of right and wrong.

Can you suggest where I am going wrong?

Thanks :)

Open up your stylesheet, and adjust the logo width:

#logo {
width:19.1em /* To prevent the logo from resizing, simply delete or comment out this section */
}

I think perhaps 10em would be a good width. The template was designed with a wider logo in mind, so the stylesheet is stretching out your logo.

[ghostcorps]

yep

Thats the one.

Thanks again

My next issue is one I've been leaving till last, but since I am here now. I often have a huge blank space between my top and 2nd attribute:

eg: http://www.fleshmetal.com.au/137/ind...roducts_id=143


I don't even know where to start on this one.

Maybe a hint will get the ball rolling :)

[jettrue]

yep

Thats the one.

Thanks again

My next issue is one I've been leaving till last, but since I am here now. I often have a huge blank space between my top and 2nd attribute:

eg: http://www.fleshmetal.com.au/137/ind...roducts_id=143


I don't even know where to start on this one.

Maybe a hint will get the ball rolling :)

The cart is pushing that second one down.

You could try changing the #cartAdd box to an absolute positioned unit, like this:

#cartAdd {
	text-align:center;
	margin:1em;
	border:1px solid #000000;
	padding:1em;
        position:absolute;
        margin-left:65%;
	}

[ghostcorps]

wow thats service!!

Did I mention this template is HOT!!!

Thanks again

[ghostcorps]

Hello again

I have almost finished my personalizations. But, have found a couple more sticking points.

I have adjusted the drop down menu so that the buttons are evenly spread across the Drop Menu, and each drop-down list is the same width as the parent. But, now there seems to be a space between the parent and child, enough to close the menu unless I am super quick. I used to know this stuff from years ago when the flyout menu contribution was still quite new, but I can't remember what to look for and none of my fiddling is fixing the problem.

www.fleshmetal.com.au/137

body {  
	behavior: url(includes/csshover.htc);
	}
	

/*grey*/ 
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #4f4f4f!important;background:#D5D5D5;}

	
#dropMenuWrapper {
	width:100%;
	height:2.17em;
	margin:0;
	font-size:1em;
	}
	
div#dropMenu {
  	width:70em;
  	margin:0 auto;
    text-align:center;
	z-index:1000;
	position:relative;
	}

div#dropMenu ul {
	margin: 0; 
	padding: 0;
	}
	
div#dropMenu li {
	position: relative; 
	list-style: none; 
	margin: 0; 
	float: left; 
	line-height: 1em;
	}
	
div#dropMenu ul.level1 {
	width:70em; 
	margin:0 auto; 
	text-align:center;
	background:#4F4F4F;
	height:2.17em;
	z-index:1000;
	}
	
div#dropMenu li:hover {}
div#dropMenu li.submenu {}
div#dropMenu li.submenu:hover {}
div#dropMenu li a {display: block; padding: .6em 0.3em .6em 0.3em;text-decoration: none; text-transform:uppercase; color:#ffffff; text-align:center;} 
div#dropMenu>ul a {width:11.05em;}
div#dropMenu ul ul {position: absolute; width: 11.7em;display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:11em;}
div#dropMenu li.submenu li.submenu {}
div#dropMenu ul.level1 li.submenu:hover ul.level2, 
div#dropMenu ul.level2 li.submenu:hover ul.level3,
div#dropMenu ul.level3 li.submenu:hover ul.level4,
div#dropMenu ul.level4 li.submenu:hover ul.level5 {display:block;z-index:1000;}
div#dropMenu ul.level2 {top: 2.17em; background:#4f4f4f;z-index:1000;}
div#dropMenu ul.level3, div#dropMenu ul.level4, div#dropMenu ul.level5 {top: 0; left: 11.7em; background:#4f4f4f}
div#dropMenu ul.level2 a {padding: 0.5em 0 0.5em 0.25em;color: white; text-transform:none;}  /* this is text color on drop-down submenu */
div#dropMenu ul.level2 a:hover {color:#4f4f4f;}

Thanks :)

[jettrue]

Hello again

I have almost finished my personalizations. But, have found a couple more sticking points.

I have adjusted the drop down menu so that the buttons are evenly spread across the Drop Menu, and each drop-down list is the same width as the parent. But, now there seems to be a space between the parent and child, enough to close the menu unless I am super quick. I used to know this stuff from years ago when the flyout menu contribution was still quite new, but I can't remember what to look for and none of my fiddling is fixing the problem.

www.fleshmetal.com.au/137

Thanks :)

You're not thinking about the problem enough.

Ok, first of all, your menu is a little too wide, in IE (at least IE7) the shopping cart drops down.

The reason your having issues is your widths don't match:

div#dropMenu ul ul {position: absolute; width: 11.7em;display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:11em;}

change the second one to match the first one.

Then you need to make your padding match:

div#dropMenu li a {display: block; padding: .6em 0.3em .6em 0.3em;text-decoration: none; text-transform:uppercase; color:#ffffff; text-align:center;} 
div#dropMenu ul.level2 a {padding: 0.5em 0 0.5em 0.25em;color: white; text-transform:none;}  /* this is text color on drop-down submenu */