CSS Dropdown menu for the header- With Categories!

Hi all!

I've been working on this issue for weeks now. I can't for the life of me figure out how to change the background colours of the last two menu items. I want the second last menu item background to be a light grey and the last menu item background be dark grey.

Also, I'm also looking to make the last menu item a little wider than the rest of the other options.

If anyone can help with this problem that would be great. Thanks!

I solved my problem. It was a CSS spacing issue with the page navigation links in the upper right hand corner of the center column. I set it to 0.4em to try and set it apart from the images a little better. After I set it back to the default of no spacing, the problem was fixed.

Thanks to anyone who looked into helping me with this.

Hi

First of all, the horizontal menu looks awesome!

But

I have a slight problem over here https://www.cuddlycotton.co.uk

If you look on the website, will easily see the space between the horizontal menu and the image i have inserted...

Tried everything to sort that out but nothing worked so far...

Maybe you may have an idea as you are my only hope at the moment :frusty:

I love the menu as well but is there a way to remove it. I have a client that is interested in the vertical sidbox css menu so i need to remove the css drop down menu from my site but not sure how. Anyone know how to go about doing this?

Hello,

Thanks for the mod, however I have found a slight formatting problem.

Viewing in IE is fine, but in Firefox there is a thick white line running across.

http://www.iwebshop.co.uk

Does anyone know how to fix this please?

thanks

sorry solved it, couldnt edit post. Fix was in the stylesheet:

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em;
background-color: #abbbd3;
background-image: url(../images/tile_back.gif);
padding: 0em 0.2em;
font-weight: bold;
color: #ffffff;
height: 30px;
}

Does anyone know how to remove the css header drop down menu. I have tried deleting the files but if i delete certain ones my page goes blank. The site is...

http://www.wpc-consulting.com/~stxmill/

Also trying to get the css header bar exactly how it is set up on my page now but vertical as in a sidebox. I have started this but not sure how to add links can anyone help on this issue.

How could I put the dropdown menu in the center column?

welchyboy:

Does anyone know how to remove the css header drop down menu. I have tried deleting the files but if i delete certain ones my page goes blank. The site is...

http://www.wpc-consulting.com/~stxmill/

Also trying to get the css header bar exactly how it is set up on my page now but vertical as in a sidebox. I have started this but not sure how to add links can anyone help on this issue.

Sorry I didn't explain that Jade if there is a way to set this exact same thing up as a vertical menu I would love to get some info on that. Because this is the best css menu out there. I love it just need it in vertical and placed in the first left sidebox where the category menu is normally located.

I just installed the CSS Dropdown menu.

1. Which file should I modify to change name of menu items?
   i.e. Category -> Products
   sub-menu items under the Information menu

2. Can I use left-align instead of center-align for displaying menu items?

3. I can build a CSS menu with image for normal, hover and current state in a normal HTML. Is it possible to use image(s) for top level of this CSS Dropdown menu?

Stephen

This has fixed some of my issues - thanks for this mod - works great - check it out at https://whatstobuyaustralia.com

bx1:

Hi all!

I've been working on this issue for weeks now. I can't for the life of me figure out how to change the background colours of the last two menu items. I want the second last menu item background to be a light grey and the last menu item background be dark grey.

Also, I'm also looking to make the last menu item a little wider than the rest of the other options.

If anyone can help with this problem that would be great. Thanks!

Hi again,

Sorry to repost but I still can't figure out how to do this. Any ideas? Thanks in advance!

Vertigo:

Hi

First of all, the horizontal menu looks awesome!

But

I have a slight problem over here https://www.cuddlycotton.co.uk

If you look on the website, will easily see the space between the horizontal menu and the image i have inserted...

Tried everything to sort that out but nothing worked so far...

Maybe you may have an idea as you are my only hope at the moment :frusty:
remove the padding-top from .centerColumn.

bx1:

Hi all!

I've been working on this issue for weeks now. I can't for the life of me figure out how to change the background colours of the last two menu items. I want the second last menu item background to be a light grey and the last menu item background be dark grey.

Also, I'm also looking to make the last menu item a little wider than the rest of the other options.

If anyone can help with this problem that would be great. Thanks!
Open up includes/templates/YOUR_TEMPLATE/common/tpl_drop_menu.php and give the two drop down's that you want to be a different color their own class, like this:

<li [B]class="contactUs"[/B]><a href="<?php echo zen_href_link(FILENAME_CONTACT_US, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CONTACT_US; ?></a></li>

Then style .contactUs in the css the way you want it.

welchyboy:

Does anyone know how to remove the css header drop down menu. I have tried deleting the files but if i delete certain ones my page goes blank. The site is...

http://www.wpc-consulting.com/~stxmill/

Also trying to get the css header bar exactly how it is set up on my page now but vertical as in a sidebox. I have started this but not sure how to add links can anyone help on this issue.
I personally would use one o of the vertical ones from the download section.

TO remove it, simply remove this from includes/templates/YOUR_TEMPLATE/common/tpl_header.php

<!--bof-drop down menu display-->
<?php require($template->get_template_dir('tpl_drop_menu.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_drop_menu.php');?>
<!--eof-drop down menu display-->

Thanks for the tip on how to remove the header. Worked like a charm :clap:

I downloaded the CSS flyout menu 1.3 which is a vertical sidebox category menu. I was able to find out how to edit it to add additional links but is there a way to have a special piece of the stylesheet just for those extra links or something. Becuase right now it is the same color and hover color as my "links" on the site which comes from my main sylesheet.css. I can change them by changing the link colors on my stylesheet.css but just wondering if there way a way to make them different so i can make it match the actual products menu. To look at it go here... Again thanks for your help :clap:

https://www.wpc-consulting.com/~stxmill

welchyboy:

Thanks for the tip on how to remove the header. Worked like a charm :clap:

I downloaded the CSS flyout menu 1.3 which is a vertical sidebox category menu. I was able to find out how to edit it to add additional links but is there a way to have a special piece of the stylesheet just for those extra links or something. Becuase right now it is the same color and hover color as my "links" on the site which comes from my main sylesheet.css. I can change them by changing the link colors on my stylesheet.css but just wondering if there way a way to make them different so i can make it match the actual products menu. To look at it go here... Again thanks for your help :clap:

https://www.wpc-consulting.com/~stxmill
I think this is the support thread of the menu you are using:

http://www.zen-cart.com/forum/showthread.php?t=68676

Great I will go through this thread and see if i can find some more answers. Thanks for the help

I'm trying to create a menu bar in my cart that 1) uses images with rollovers as the buttons and 2) does not link to my categories (as the store sells only one thing), but links to the rest of the pages in my site, which are regular old HTML pages, not the EZ pages.

I've tried a couple different mods and nothing seems to work. Does anyone out there know if this can be done, and if so, what mod should I be using?

Here's a link to a page that has the menu bar I'd like to use.

https://www.westcoastwhoopies.com/about.html

Thanks from a lost newbie!

Hello,
I recently added a new top-level link to my css menu. After that, the menu is not centered properly on the page. I decided to use relative positioning to try and center the menu again, but now the positioning is ok for my monitor and skewed on others. I realized that I needed to set the menu's horizontal margin to auto (I know this won't work in IE7 due to a bug, but that's a separate issue that I'll learn about later). Problem is, it already seems like that's been done in the stylesheet. I noticed that I've got multiple div's in the page code for the drop menu. Using Firefox and the Firebug add-on I noticed: #dropMenuWrapper, #dropMenuWrapperb, #dropMenuWrapperc and #dropMenuWrapperd. Are all of these supposed to be there? They're all empty div's. Furthermore, when I use the Inspect function of Firebug it appears that my menu is not positioned inside of the dropMenu div like it should be, but is actually below it. I'm not sure if I made a mistake or not, but I would think that the menu should auto center itself whenever new links are added/removed.

Would somebody be willing to take a look at my site's CSS and point me in the right direction as to where I should start making changes? Any help is appreciated.

Thanks,