Thanks for all your time on this, there were certain things that I had not the time to figure out... I truly appreciate it! I'll give them a try on my test site soon~
Printable View
No problem! It was fun to tweak with, and I learned a ton. I'd never even heard of CSS before I started working on these problems, and my knowledge of html was limited. Things have sure changed a lot with html! My last experience was a few years back writing a website as an assignment for a class. I keep having to check and see if my site validates because of the new xhtml rules. :)
Woo hoo!!! I figured out how to fix the problem with the blank menus in IE7!!!
The bug in IE7 is documented here: http://murphy.cz/ie7-hover-ghosts-bug/
I couldn't have done this without this website.
Here's how to fix it:
div#dropMenu li a.noLine {border:none;}
div#dropMenu>ul a {width: auto; z-index:1000;}
CHANGE THIS:div#dropMenu ul ul {display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:12em;z-index:1000;}
/*div#dropMenu li.submenu li.submenu {background: url(../images/submenu.gif) 95% 50% no-repeat;} */
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,
div#dropMenu ul.level5 li.submenu:hover ul.level6,
div#dropMenu ul.level6 li.submenu:hover ul.level7,
CHANGE THIS:div#dropMenu ul.level7 li.submenu:hover ul.level8 {display:block;z-index:1000;position: absolute; width: 12em;}
div#dropMenu ul.level2 {background:#4f4f4f;z-index:1000;position:absolute;left:0;}
div#dropMenu ul.level3,
div#dropMenu ul.level4,
div#dropMenu ul.level5,
div#dropMenu ul.level6,
div#dropMenu ul.level7,
div#dropMenu ul.level8{top: 0; left: 12em; 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;}
Essentially, all I did was move "position: absolute; width: 12em;" to a new spot. Problem solved!!! :)
I would like to change the name MANUFACTURES to DESIGNERS.
Throughout the site. How do i do this?
Is the main_template_vars.php the place to make the change?
}
// create column list
$define_list = array('PRODUCT_LIST_MODEL' => PRODUCT_LIST_MODEL,
'PRODUCT_LIST_NAME' => PRODUCT_LIST_NAME,
'PRODUCT_LIST_MANUFACTURER' => PRODUCT_LIST_MANUFACTURER,
'PRODUCT_LIST_PRICE' => PRODUCT_LIST_PRICE,
'PRODUCT_LIST_QUANTITY' => PRODUCT_LIST_QUANTITY,
'PRODUCT_LIST_WEIGHT' => PRODUCT_LIST_WEIGHT,
'PRODUCT_LIST_IMAGE' => PRODUCT_LIST_IMAGE);
/* ,
'PRODUCT_LIST_BUY_NOW' => PRODUCT_LIST_BUY_NOW);
*/
asort($define_list);
reset($define_list);
$column_list = array();
foreach ($define_list as $key => $value)
{
if ($value > 0) $column_list[] = $key;
}
$select_column_list = '';
for ($i=0, $n=sizeof($column_list); $i<$n; $i++)
{
switch ($column_list[$i])
{
case 'PRODUCT_LIST_MODEL':
$select_column_list .= 'p.products_model, ';
break;
case 'PRODUCT_LIST_NAME':
$select_column_list .= 'pd.products_name, ';
break;
case 'PRODUCT_LIST_MANUFACTURER':
$select_column_list .= 'm.manufacturers_name, ';
break;
case 'PRODUCT_LIST_QUANTITY':
$select_column_list .= 'p.products_quantity, ';
break;
case 'PRODUCT_LIST_IMAGE':
$select_column_list .= 'p.products_image, ';
break;
case 'PRODUCT_LIST_WEIGHT':
$select_column_list .= 'p.products_weight, ';
break;
}
}
// always add quantity regardless of whether or not it is in the listing for add to cart buttons
if (PRODUCT_LIST_QUANTITY < 1) {
$select_column_list .= 'p.products_quantity, ';
:lamo:
I noticed that my fix for the bottom shadow line moving around had some unintended consequences. The "Home Link" in the footer started to move around. It seems that the drop-down menu doesn't play nice with anything in the same <div>! So, here is my new fix which solves this problem:
Add to stylesheet.css:
#bottomLineWrapper {
width:100%;
margin:0 auto;
margin-top:-6px;
*float:left;
position:relative;
top:2.18em;
}
#bottomLine {
margin:0 auto;
text-align:center;
width:70.3em;
padding-top:1em;
}
Change in stylesheet.css by replacing navSupp with bottomLine:
* html #centerColumnWrapper, * html #centerColumnWrapperb, * html #headerWrapperb, * html #headerWrapperc, * html #dropMenuWrapperc, * html #dropMenuWrapperd, * html #bottomLine {
background:none!important; /* Hides the transparent shadows from older versions of IE */
}
#bottomLine {
background:url(../images/shadowAlpha_bot.png) repeat-x top;
}
And change the following in stylesheet.css by adding bottomLine to all of these:
#navSupp ul, #bottomLine ul {
list-style-type:none;
text-align:center;
line-height:1.5em;
padding: 0.3em 0;
margin:0;
}
#navSupp li, #navCatTabs li, #navMainLinks li, #bottomLine li {
display:inline;
padding:0 0.5em;
margin:0;
}
#navSupp ul li a, #navCatTabs ul li a, #bottomLine ul li a {
text-decoration:none;
margin:0;
white-space:nowrap;
display:inline;
font-weight:bold;
width:0;
color:#4f4f4f;
}
#navSupp ul li a:hover, #navCatTabs ul li a:hover, #bottomLine ul li a:hover {
color:#0000FF;
text-decoration:underline;
}
Then, edit tpl_footer.php -- you should copy it to the apple_zen "common" overide directory first. Replace the section around "navigation display" with the following:
<!--bof-navigation display -->
<div id="bottomLineWrapper">
<div id="bottomLine">
<ul>
<li><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'; ?><?php echo HEADER_TITLE_CATALOG; ?></a></li>
<?php if (EZPAGES_STATUS_FOOTER == '1' or (EZPAGES_STATUS_FOOTER == '2' and (strstr(EXCLUDE_ADMIN_IP_FOR_MAINTENANCE, $_SERVER['REMOTE_ADDR'])))) { ?>
<li><?php require($template->get_template_dir('tpl_ezpages_bar_footer.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_ezpages_bar_footer.php'); ?></li>
<?php } ?>
</ul>
</div></div>
<div id="navSuppWrapper">
<div id="navSupp">
</div>
</div>
<!--eof-navigation display -->
That's it! It's not an easy fix, but it works. That drop-down menu just doesn't play nice unless it has its own div id (in this case navSupp & its wrapper).
Thanks again. My computer is in the shop (hard drive failure in my mac mini), so I'm using hubbies right now. I was all excited thinking that i could boot with my external drive with bootable backup on his iMac, but Dang Darn Dang, my mac mini is a PowerPC mac, while his is intel based, and I can't boot to my drive... wah! So, while I can get to my files, I can't run my software and such easily, so I'll be slower in getting your updates added.
Now that I'm done writing a book about it...
That's alright. I obviously have added these changes to my site already as I have been finding them. :)
Ouch! Hard drive failure.... I've always heard they tend to stop working after awhile, but I have always been lucky. Good thing you have a backup!!! I must admit, since I switched to Ubuntu Linux, I haven't taken the time to setup a backup routine. I should do that. :)
By the way, I found a small bug that doesn't affect your template unless you start messing around with the checkout progress bar -- which I have obviously been doing, or I wouldn't have run into this! :)
There is a <div> in tpl_checkout_success_default.php which doesn't get closed:
<!-- bof Order Steps (tableless) -->
<div id="order_steps">
<div class="order_steps_text">
<span class="order_steps_text2"><?php echo TEXT_ORDER_STEPS_1; ?></span><span class="order_steps_text3"><?php echo TEXT_ORDER_STEPS_2; ?></span><span class="order_steps_text4"><?php echo TEXT_ORDER_STEPS_3; ?></span><span id="active_step_text"><?php echo zen_image($template->get_template_dir(ORDER_STEPS_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . ORDER_STEPS_IMAGE, ORDER_STEPS_IMAGE_ALT); ?><br /><?php echo TEXT_ORDER_STEPS_4; ?></span>
</div>
<div class="order_steps_line_2">
<span class="progressbar_active"> </span><span class="progressbar_active"> </span><span class="progressbar_active"> </span><span class="progressbar_active"> </span>
ADD: </div>
</div>
<!-- eof Order Steps (tableless) -->
I also found another little bug that affects the layout of the header in ie5.5. There is a semi-colon missing after width:19.1em in stylesheet.css:
#logo {
CHANGE: width:19.1em; /* To prevent the logo from resizing, simply delete or comment out this section */
}
Hi - I love apple zen :smile: but erm I'm a real newbie, I'm not sure if my problems are template based or just erm idiot based :blush: but I was wondering if anyone could help?
Firstly the bar at the very top of the page - I can't change its colour?
Also I tried to add a new category, and it popped up in th nav bar. not in the drop down category menu, and I can't work out how to get it there?
Sorry if these questions are eye roll worthy lol
here's my site so you can see what a mess I've been making www.beautybybea.co.uk
:huh: I just tried adding the 'About Us' page following the readme and I must have done that wrong too I got (when I tried to do define pages edit)
Error: I can not write to this file. Please set the right user permissions on: /home/beautyby/public_html/shop/includes/languages/english/html_includes/define_about_us.php
:frusty: