CSS Dropdown menu for the header- With Categories!

[jettrue]

does anyone know why I have a gray bar under my css menu in IE?

Link?

[bumba000]

thanks jettrue but i got rid of the menu for now.

im battling screen resolution now too. I noticed that at 800x600 (at least in IE)
most of the site looks pretty bad.
As i struggle and struggle with this I just hope that most of the world is at least 1024x768.

I have made a new header img only 790px wide but for some reason at 800x600 the end of the image still gets cut off and the site doesnt really layout properly.

I know this isnt the right place for this. . .

John

[bumba000]

okay, So i twisted my own arm. Settled for 1024x768 as a base size to please.

I put the css drop menu back in. still have the same gray bar under it tho. I dont see any link there and there shouldnt be one.

If you will have a look please. . . just use my signature.

thanks,
John

[jettrue]

okay, So i twisted my own arm. Settled for 1024x768 as a base size to please.

I put the css drop menu back in. still have the same gray bar under it tho. I dont see any link there and there shouldnt be one.

If you will have a look please. . . just use my signature.

thanks,
John

I see no grey bar, however I can tell you that you need a <div class="clearBoth"></div> at the bottom of includes/templates/YOUR_TEMPLATE/common/tpl_drop_menu.php

[jettrue]

thanks jettrue but i got rid of the menu for now.

im battling screen resolution now too. I noticed that at 800x600 (at least in IE)
most of the site looks pretty bad.
As i struggle and struggle with this I just hope that most of the world is at least 1024x768.

I have made a new header img only 790px wide but for some reason at 800x600 the end of the image still gets cut off and the site doesnt really layout properly.

I know this isnt the right place for this. . .

John

You do know that your header image is still 1010 wide right? Perhaps you changed it back, but wanted to let you know.

[bumba000]

jettrue,
the div tags you had me add to tpl_header.php would have helped a long time ago.

I got the gray trying to figure out why in IE everything was fine but it firefox my first columLeft sidebox top was under my new menu.

was all about the <div class="clearBoth"></div>.

thank you.
John

[bumba000]

how do i change the name catagories to products?

the header image in use is not bg_header.jpg.
this is what i did. So that where the header img stops after 790 it doesnt look like it stopped. This was to try to fit in 800x600.
Kinda like the sliding door method.

#headerWrapper {position: relative; background-image: url(../images/bg_navmain_header-blue-white-expand.gif); /*IE Hack*/}

#headerBackground {width: 100%; height: 120px; background-color:#FFFFFF; background: url(../images/bg_header_790x119.jpg) no-repeat;}

[mauryg]

Thanks Jade, that's what I thought the answers would be

[hansi]

Hi Guys,

I am having a weird problem. I have installed the drop-down menu and changed the menu options to fit my web site's objectives. However, the menu works fine except for a trailing empty cell that seems to ruin the look of the menu. Here is my URL:
http://www.eclat-consultants.co.uk/i...ain_page=index

Just look at the trailing empty cell after My Account. Can you please help me?

Here is my code for tpl_drop_menu.php:

<?php
//
// +----------------------------------------------------------------------+
// |zen-cart Open Source E-commerce |
// +----------------------------------------------------------------------+
// | Copyright (c) 2003 The zen-cart developers |
// | |
// | http://www.zen-cart.com/index.php |
// | |
// | Portions Copyright (c) 2003 osCommerce |
// +----------------------------------------------------------------------+
// | This source file is subject to version 2.0 of the GPL license, |
// | that is bundled with this package in the file LICENSE, and is |
// | available through the world-wide-web at the following url: |
// | http://www.zen-cart.com/license/2_0.txt. |
// | If you did not receive a copy of the zen-cart license and are unable |
// | to obtain it through the world-wide-web, please send a note to |
// | [email protected] so we can mail you a copy immediately. |
// +----------------------------------------------------------------------+
// $Id: tpl_drop_menu.php 2005/06/15 15:39:05 DrByte Exp $
//

?>
<!-- menu area -->

<div id="dropMenuWrapper">
<div id="dropMenuWrapperb">
<div id="dropMenuWrapperc">
<div id="dropMenuWrapperd">
<div id="dropMenu">
<ul class="level1">
<li class="submenu"><a href="<?php echo zen_href_link(FILENAME_DEFAULT); ?>"><?php echo HEADER_TITLE_CATALOG; ?></a>
<!--<ul class="level2">
<li><a href="<?php echo zen_href_link(FILENAME_PRODUCTS_NEW); ?>"><?php echo HEADER_TITLE_NEW_PRODUCTS; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_PRODUCTS_ALL); ?>"><?php echo HEADER_TITLE_ALL_PRODUCTS; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_SPECIALS); ?>"><?php echo HEADER_TITLE_SPECIALS; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_ADVANCED_SEARCH); ?>"><?php echo HEADER_TITLE_SEARCH; ?></a></li>
</ul>-->
</li>
<li class="submenu"><a href="http://www.eclat-consultants.co.uk/index.php?main_page=page&id=18&chapter=0">About us</a></li>
<li class="submenu"><a href="<?php echo zen_href_link(FILENAME_SITE_MAP); ?>"><?php echo HEADER_TITLE_CATEGORIES; ?></a>
<?php

// load the UL-generator class and produce the menu list dynamically from there
require_once (DIR_WS_CLASSES . 'categories_ul_generator.php');
$zen_CategoriesUL = new zen_categories_ul_generator;
$menulist = $zen_CategoriesUL->buildTree(true);
$menulist = str_replace('"level4"','"level5"',$menulist);
$menulist = str_replace('"level3"','"level4"',$menulist);
$menulist = str_replace('"level2"','"level3"',$menulist);
$menulist = str_replace('"level1"','"level2"',$menulist);
$menulist = str_replace('<li class="submenu">','<li class="submenu">',$menulist);
$menulist = str_replace("</li>\n</ul>\n</li>\n</ul>\n","</li>\n</ul>\n",$menulist);
echo $menulist;
?>
</li>
<li class="submenu"><a href="<?php echo zen_href_link(FILENAME_DEFAULT); ?>"><?php echo HEADER_TITLE_INFORMATION; ?></a>
<ul class="level2">
<!--<li><a href="<?php echo zen_href_link(FILENAME_SHIPPING); ?>"><?php echo HEADER_TITLE_SHIPPING_INFO; ?></a></li>-->
<li><a href="<?php echo zen_href_link(FILENAME_PRIVACY); ?>"><?php echo HEADER_TITLE_PRIVACY_POLICY; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_CONDITIONS); ?>"><?php echo HEADER_TITLE_CONDITIONS_OF_USE; ?></a></li>
<!--<li><a href="<?php echo zen_href_link(FILENAME_ABOUT_US); ?>"><?php echo HEADER_TITLE_ABOUT_US; ?></a></li>-->
<?php if (defined('FILENAME_SITE_MAP')) { ?>
<li><a href="<?php echo zen_href_link(FILENAME_SITE_MAP); ?>"><?php echo HEADER_TITLE_SITE_MAP; ?></a></li>
<?php } ?>
<?php if (MODULE_ORDER_TOTAL_GV_STATUS == 'true') { ?>
<!--<li><a href="<?php echo zen_href_link(FILENAME_GV_FAQ, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_GV_FAQ; ?></a></li>-->
<?php } ?>
<?php if (MODULE_ORDER_TOTAL_COUPON_STATUS == 'true') { ?>
<!-- <li><a href="<?php echo zen_href_link(FILENAME_DISCOUNT_COUPON, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_DISCOUNT_COUPON; ?></a></li> -->
<?php } ?>
<?php if (SHOW_NEWSLETTER_UNSUBSCRIBE_LINK == 'true') { ?>
<li><a href="<?php echo zen_href_link(FILENAME_UNSUBSCRIBE, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_UNSUBSCRIBE; ?></a></li>
<?php } ?>
</ul>
</li>
<li><a href="<?php echo zen_href_link(FILENAME_CONTACT_US, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CONTACT_US; ?></a></li>
<li class="submenu"><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a>
<ul class="level2">
<?php if ($_SESSION['customer_id']) { ?>
<li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGOFF; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT_NEWSLETTERS, '', 'SSL'); ?>"><?php echo HEADER_TITLE_NEWSLETTERS; ?></a></li>
<?php } else { ?>
<li><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGIN; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_CREATE_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CREATE_ACCOUNT; ?></a></li>
<?php } ?>
<?php if ($_SESSION['cart']->count_contents() != 0) { ?>
<li><a class="noLine" href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CHECKOUT; ?></a></li>
<?php } else { ?>
<li><a class="noLine" href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a></li>
<?php } ?>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div><!-- end dropMenuWrapper-->
<div class="clearBoth"></div>

[jettrue]

Hi Guys,

I am having a weird problem. I have installed the drop-down menu and changed the menu options to fit my web site's objectives. However, the menu works fine except for a trailing empty cell that seems to ruin the look of the menu. Here is my URL:
http://www.eclat-consultants.co.uk/i...ain_page=index

Just look at the trailing empty cell after My Account. Can you please help me?

Here is my code for tpl_drop_menu.php:

It looks like you found the answer. YAY! I am cursing the day that I decided to originally design the menu with extra space leftover at the end... it wasn't an "empty cell", just extra space, so that the menu wouldn't break into two lines when font size was increased, but now that the newest version is designed in percentages and that problem is solved, perhaps I'll not have to answer this question every other day, LOL.