Top Menu Design

Is there a resonably straight forward way I could inplement a top menu like in this site http://www.supercheapauto.com.au/online-store/outdoor/4wd.aspx?id=44 but still keeping the side menu.

Yes.

I whipped one out yesterday in about 3 hours but I have spent the last day and a half working (bashing my head against a wall) on a single ie6/ie7 z-index issue with one of the sub menus.  Your example does not overlap and I may consider changing it to that style if I can't get my overlapping ones to work.

I will post the code once I fix the ie issues.  Or I may just post it anyways and let the community take a crack at it.

NopCommerce is great but sorely lacks a suitable navigation menu.

Stay tuned.

joe

Thanks Joe. Can't wait to see something.

Hi,

I need help in removing the Black Background from the HeaderMenu. I embedded a hover menu but it seems to be overlapping the Black Background from somewhere.

I located the settings in 2 master.css files; one in "App_Themes\administration" directory and the other is in "App_Themes\darkOrange" directory. I changed/removed the image of the master.css file in "App_Themes\administration" directory where it says: "admin-menu-bg.gif" but it had no effect.

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

  MASTER HEADER MENU

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.header-menu
{
  #width: 100%;
  #line-height: 29px;
  #height:31px;
  #background: url('images/admin-menu-bg.gif') repeat-x;  
}

SECONDLY,

I changed/removed the background color line of the master.css file in "App_Themes\darkOrange" directory but it had no effect either.

The below shows you what the site looks like:

http://myamericanfurnituregalleries.com/

Your help is much appreciated!

Saeb & Joe,

I am trying to do a hover menu that is dynamically populated with mycategories horizontally like the ones you say above. Please can you advise how you are acheiving the hover/ flyout menus? Are you altering the code behinds in anyway? As I cant get it to work when I try.

Tom,

Do you use firefox at all? If so then download an add on called firebug. When you turn it on it you can hover over sections of your page and it will display the css that affects that block in the bottom right hand corner. Its does all the tags that are affecting it, this means that you can track through the classes and tags and see where the problem is coming from....

in fact i am showing you header menu to have the following:

headermenu  
{
background:none repeat scroll 0 0 #3A3A3A;
color:#FFFFFF;
height:100%;
letter-spacing:1px;
margin-bottom:10px;
padding:8px 5px 9px;
text-align:center;
vertical-align:middle;
}

where as you have said the tag above is .header-menu which is not what i am seeing on your site.

I made a menu a while back that I emailed to another user that has the functionality you are looking for.  He posted it on a file sharing site.  Search this forum and it should still be there.  The topic was something like "Category Menu Now Available" or something like that.

PM me if you get stuck and I will see if I still have it somewhere.

joe

Hi DW Jenkis,

I will install the firebug Add-On when I get back to work. Right now I only use FireFox Aarkvard which provides me the  classes and tags info like the firebug, but I didn't see my HeaderMenu the way you see. All I see in the master.css file is:

header-menu
{
  #width: 100%;
  #line-height: 29px;
  #height:31px;
  #background: url('images/admin-menu-bg.gif') repeat-x;  
}

Nothing like what you see. Perhaps this is an issues of having too many backup of master.css on the hosting server like Steve had mentioned.

Will let you know the outcome and thanks so much for the tips.

Here is the post for the follow up to this posting.

https://www.nopcommerce.com/boards/t/5033/category-header-menu-is-available.aspx

You will find my link to the header menu here.

I'm not sure if this works with 1.7 or higher as I have not tried it with either of these versions.

Hi,

Back to work and still trying to clean up the site. Such a huge help be removing EXTRA css in the same directory. It fixed some of the alignment perfectly the way I wanted.

I am still having trouble change the text in the HeaderLink to blue to brown. Not only removing all extra master.css files changed my the text in the HeaderMenu from white to Blue, but in the Admin Panel, all the text still WHITE. I looked and looked at all CSS files and did not see a place where I could change the TEXT to a different color through my entire site inclung in the Admin Panel.

Any help would appreciated!

Hi,

I have a couple of issues I can't seem to solve:

1) How to make my HeaderMenu to show Visited or Selected when you click on the the button.

2) Changing the text color in the "Register; Login; Shopping Cart; and Wishlist (this is in the HeaderLink Section). Also text color through the entire site. At first, I was able to change it in the Style files, but after awhile, it rolled back by itselft like something took over control from the Server End??

www.myamericanfurnituregalleries.com

Your tips and guides are appreciated!