CSS Dropdown menu for the header- With Categories!

[Get Em Fast]

Is it possible to toggle Login/Logoff on the menu ?

Thanks, John

There's no "on/off" switch, but the file can be edited to NOT display it;

Just look in includes/templates/CUSTOM/common/tpl_drop_menu.php at around lines 100-111. You can either comment them out or delete them totally. Either way the menu will not display those links.

That section of code mentioned above should look exactly like this:

<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 } ?>
              </ul>
            </li>

Hope this helps.
Robert

[milobloom]

I have this mod installed on my web site

www.allforyourwedding.com


I have a question. I have way to many categories. Is there any way they can be automatically set to say go 10 down and then a new column.
Or could someone tell me a better way I can handle this? My only last thought would to just have a button called "Categories" that someone would click and it gives them them in the center...

[Get Em Fast]

milo,

I'm REAL busy today, but I had a couple of minutes to spare, so I done you some "quick & dirty" css just to get you started. It REALLY is dirty too, so you'll have to correct things, as I just added these lines to the very bottom of your stylesheet, making them override previous code. Anyway, this should get you on your way, anyway:

.col_1.firstcolumn, .dropdown_1column {max-height: 500px; width: 874px; background: skyblue!important; margin-top: -5px;}

div#wrapper_menu>ul>li>div>div>ul>ul>li>ul {background: black!important; z-index: 1000;}

See?...............Told you it was "dirty". Also, if you notice, to make sure you know which column is which, I've left "named" colors there for you.

Sorry so quick, sorry so dirty, but hope it helps get you started.

[milobloom]

What CSS file do I add this to the bottom to?

thanks

[DivaVocals]

What CSS file do I add this to the bottom to?

thanks

The end of your template's stylesheet..

BTW, you do know the menu your template uses is not the menu that this support thread is for?? (unless Anne has simply combined this menu's stylesheet with the template stylesheet)

[Get Em Fast]

Diva's correct..............on all accounts:

1) at the bottom of your templates' stylesheet, since the MENU'S stylesheet isn't there.
2) This is not the correct thread for this particular menu, as it's NOT in the downloads, but rather custom built by starting with a mega-menu which you can find more information on HERE and HERE. Once you get there, you can most likely get some use the information to re-design yours even better, as what I showed you earlier really is a "dirty" quick-fix that I was kinda' ashamed to post, but don't have much time today, so...........
3) (unless Anne has simply combined this menu's stylesheet with the template stylesheet). Diva, isn't this Brandon Turpin's template?

The thread for it is HERE, which would probably be a better place for milo to get his answer.



Hope this helps,
Robert

[DivaVocals]

You are probably right.. I just knew it was the mega menu which Anne uses in a few of her templates..

Diva's correct..............on all accounts:

1) at the bottom of your templates' stylesheet, since the MENU'S stylesheet isn't there.
2) This is not the correct thread for this particular menu, as it's NOT in the downloads, but rather custom built by starting with a mega-menu which you can find more information on HERE and HERE. Once you get there, you can most likely get some use the information to re-design yours even better, as what I showed you earlier really is a "dirty" quick-fix that I was kinda' ashamed to post, but don't have much time today, so...........
3) (unless Anne has simply combined this menu's stylesheet with the template stylesheet). Diva, isn't this Brandon Turpin's template?

The thread for it is HERE, which would probably be a better place for milo to get his answer.



Hope this helps,
Robert

[crazysarah]

Hey there, First off, I know about the htc file but I'm still having trouble getting this to work in ie6. I'm on my localhost so in my configure files i have like:

define('HTTP_SERVER', 'http://169.254.107.215');

In my htaccess I haven't done the redirect because (a) at this stage I think I don't need it (?) and (b) I'm not sure what I'd put in there since this is a localhost.

I did put in the bit so it loads the correct mime type and I'm using css3PIE which also makes use of an htc file and I know it works fine.

I have altered the original code so that I can add a little more detail to my graphics so there's a few divs that are new etc... Here's my code:

<div id="dropMenuWrapper">
  <div id="dropMenu">
    <ul class="level1">
<li class="submenu"><div class="catCont"><div class="cats-top">Guinness</div><div class="cats-bottom"> Merchandise</div></div><div class="pointer"></div><div class="seperator"></div><ul class="level2"><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=8">Guinness Clothes</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=9">Guinness Hats</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=10">Guinness kitchen</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=11">Guinness Magnets & key rings</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=12">Guinness Memorabilia</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=14">The Guinness Golfer</a></li></ul></li><li class="submenu"><div class="catCont"><div class="cats-top">Irish Gifts </div><div class="cats-bottom">&amp; Souvenirs</div></div><div class="pointer"></div><div class="seperator"></div><ul class="level2"><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=3">Bushmills Merchandise</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=6">Finnians Irish Ornaments</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=16">Irish Novelties &amp; Gift Ideas</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=21">Magnets &amp; Keyrings</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=24">Northern Ireland football</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=26">Teddy Bears &amp; Dolls</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=27">Titanic Gifts</a></li></ul></li><li class="submenu"><div class="catCont"><div class="cats-top">Irish Clothes </div><div class="cats-bottom">&amp; Knitwear</div></div><div class="pointer"></div><div class="seperator"></div><ul class="level2"><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=1">Aran Wool Knitwear</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=5">Designer Ladies scarves</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=15">Irish &amp; Ulster Rugby Shirts and hats</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=18">Irish Neck Ties</a></li></ul></li><li class="submenu"><div class="catCont"><div class="cats-top">Irish Home </div><div class="cats-bottom">&amp; Decor</div></div><div class="pointer"></div><div class="seperator"></div><ul class="level2"><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=17">Irish Mugs &amp; Kitchen Ware</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=19">Irish Sculptures &amp; Ornaments </a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=20">Irish Tea Towels</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=23">Mohair Throws</a></li><li>
	<a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=25">Picture Frames &amp; Wall Hanging Plaques</a></li></ul></li><li><a href="http://169.254.107.215/blank/index.php?main_page=index&amp;cPath=4"><div class="catCont"><div class="cats-top">Celtic</div><div class="cats-bottom"> Jewelry</div></div><div class="pointer"></div><div class="seperator"></div></a></li>
      <li class="submenu"><div class="catCont"><div class="cats-top">Browse by </div><div class="cats-bottom">Price Range</div></div><div class="pointer"></div>
        <ul class="level2">
          <li><a href="http://169.254.107.215/blank/index.php?main_page=shippinginfo">Shipping Info</a></li>
          <li><a href="http://169.254.107.215/blank/index.php?main_page=privacy">Privacy Policy</a></li>
          <li><a href="http://169.254.107.215/blank/index.php?main_page=conditions">Conditions of Use</a></li>
		  <li><a href="http://169.254.107.215/blank/index.php?main_page=FILENAME_ABOUT_US">About Us</a></li>
                    <li><a href="http://169.254.107.215/blank/index.php?main_page=site_map">Site Map</a></li>
                    <li><a href="http://169.254.107.215/blank/index.php?main_page=gv_faq">Gift Certificate FAQ</a></li>
          <li><a href="http://169.254.107.215/blank/index.php?main_page=discount_coupon">Discout Coupons</a></li>
          <li><a href="http://169.254.107.215/blank/index.php?main_page=unsubscribe">Newsletter Unsubscribe</a></li>
        </ul>
      </li>

    </ul>
  </div>
</div>

And the css:

body {  
	behavior: url(includes/csshover.htc);
	}
	
/*green*/
div#dropMenu li.submenu li.submenu:hover {color: #4f4f4f!important;background:#D5E88F;}


/*blue
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #ffffff!important;background:#6C99D9;}
*/ 

/*red 
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover, div#dropMenu ul.level2 a:hover {color: #ffffff!important;background:#DC262E;}
*/ 

/*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:53px;
	margin:0;
	font-size:11px;
	}
	
div#dropMenu {
  	width:960px;
  	margin:0 auto;
	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:960px; 
	margin:0 auto; 
	background-image: url(../images/navbg.gif);
	background-repeat:repeat-x;
	height:53px;
	z-index:1000;
	}
	
.cats-top{font-size:14px;font-weight:bold;color:#babc04;}
.cats-bottom{font-size:14px;font-weight:bold;color:#ffffff;}
.catCont{margin:15px 15px 15px 30px;float:left;}
.pointer{background-image: url(../images/blackPointer.gif);width:13px;height:53px;float:left;margin-right:27px;}
.seperator{background-image: url(../images/navsep.gif);width:2px;height:53px;float:left;}
	
div#dropMenu li:hover {}
div#dropMenu li.submenu {}
div#dropMenu li.submenu:hover {}
div#dropMenu li a {display: block;} 
div#dropMenu>ul a {width: auto;}
div#dropMenu ul ul {position: absolute; width: 13em;display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:13em;}
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: 53px; background:#4f4f4f;z-index:1000;}
div#dropMenu ul.level3, div#dropMenu ul.level4, div#dropMenu ul.level5 {top: 0; left: 13em; background:#4f4f4f}
div#dropMenu ul.level2 a {padding: 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;}

Can anyone tell me how I can make this work with IE6? It's been driving me nuts for hours now. (bugger you Gates)

[sharc316]

Hi,

I have installed a the simple dropdown menu and I love it. But after testing it out I noticed that when viewing a certain category and then going into a product in another category the category remains the same. It does not change according to where the product you clicked on is located. This creates an issue when you click on a previous or next product arrow; where you get an error that product does not exist.

Let me give you a specific example on my site. My site www.bequjuice.com

When you first enter the site you are in the Juice paQs category. Then hover over the Pressed Juice category and click on any of the products there. Once the page is loaded you can see right under the PurePress logo that you're still in Juice paQs category. It did not change to Pressed Juice category. So then when you click the next arrow you will get an error saying the product was not found.

Can anyone please help fix this issue?

Thanks

[Get Em Fast]

@ Sharc316:

After looking at your site, I see that you don't have this menu (CSS Dropdown menu for the header- With Categories!), but rather the
Category Tab Simple Dropdown Menu. I see you've posted a question in it's support thread about adding links...............that would be the place to go back to for help on that particular menu.

Hope this helps.