Problem with menu on home page

  • 1
  • Question
  • Updated 9 years ago
  • Answered
For some reason the menu on my home page (www.mcran.com) is not displaying properly. It should look like the menus on the other pages in my site. I am using a HTML widget to contain the code, which is the exact code that is used for the menu that appears on the other pages. What should I do so that my home page menu looks like the other menu on my other pages?

I tried deleting the HTML widget on the home page, and recreating a new one. I tried deleting the code from the HTML widget and publishing my site. It published obviously with no menu on the home page, so I copy/pasted the menu code again from one of the pages, and still I am getting the old menu that was there before and not the menu that appears on the other pages.
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
  • Stumped

Posted 9 years ago

  • 1
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hi Randy,

Well, that is a strange one. My first reaction would be to delete the HTML widget on the home page, and copy the code from one of the other pages, and then re-add the widget to the home page with the code... but this is what you said you have done correct?

I am not the code expert here... If Kershnee or Sanja were here I bet one of them would know what was happening. I am thinking that there is some other code on the page changing the menu a bit, but I am not positive.

Can you give us the code that creates the menu here so we can test it. I would like to see how it behaves on a test site.

Emmy
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
Thanks Emmy!

I want to paste the code here but I forget how to paste it properly.
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hi Randy,
Wrap the code in this at the beginning <!-- and this at the end -->
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
Here you go:

<!-- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <title>Generated by PureCSSMenu.com</title> </head> <body bgcolor="#FFFFFF"> <!-- Css Menu --> ul.cssMenu ul{display:none} ul.cssMenu li:hover>ul{display:block} ul.cssMenu ul{position: absolute;left:-1px;top:98%;} ul.cssMenu ul ul{position: absolute;left:98%;top:-2px;} ul.cssMenu,ul.cssMenu ul { margin:0px; list-style:none; padding:0px 2px 2px 0px; background-color:#32854E; background-repeat:repeat; border-color:#cccccc #111111 #111111 #cccccc; border-width:1px; border-style:solid; } ul.cssMenu table {border-collapse:collapse}ul.cssMenu { display:block; zoom:1; float: left; } ul.cssMenu ul{ width:182.70000000000002px; } ul.cssMenu li{ display:block; margin:2px 0px 0px 2px; font-size:0px; } ul.cssMenu a:active, ul.cssMenu a:focus { outline-style:none; } ul.cssMenu a, ul.cssMenu li.dis a:hover, ul.cssMenu li.sep a:hover { display:block; vertical-align:middle; background-color:#32854E; border-width:1px; border-color:#32854E; border-style:solid; text-align:left; text-decoration:none; padding:2px 5px 2px 10px; _padding-left:0; font:16px Arial; color: #080808; text-decoration:none; cursor:default; } ul.cssMenu span{ overflow:hidden; } ul.cssMenu li { float:left; } ul.cssMenu ul li { float:none; } ul.cssMenu ul a { text-align:left; white-space:nowrap; } ul.cssMenu li.sep{ text-align:left; padding:0px; line-height:0; height:100%; } ul.cssMenu li.sep span{ float:none; padding-right:0; width:3px; height:100%; display:inline-block; background-color:#cccccc #111111 #111111 #cccccc; background-image:none;} ul.cssMenu ul li.sep span{ width:100%; height:3px; } ul.cssMenu li:hover{ position:relative; } ul.cssMenu li:hover>a{ background-color:#4FD17B; border-color:#1F5230; border-style:solid; font:16px Arial; color: #071706; text-decoration:none; } ul.cssMenu li a:hover{ position:relative; background-color:#4FD17B; border-color:#1F5230; border-style:solid; font:16px Arial; color: #071706; text-decoration:none; } ul.cssMenu li.dis a { color: #666 !important; } ul.cssMenu img {border: none;float:left;_float:none;margin-right:2px;width:16px; height:16px; } ul.cssMenu ul img {width:16px; height:16px; } ul.cssMenu img.over{display:none} ul.cssMenu li.dis a:hover img.over{display:none !important} ul.cssMenu li.dis a:hover img.def {display:inline !important} ul.cssMenu li:hover > a img.def {display:none} ul.cssMenu li:hover > a img.over {display:inline} ul.cssMenu a:hover img.over,ul.cssMenu a:hover ul img.def,ul.cssMenu a:hover a:hover ul img.def,ul.cssMenu a:hover a:hover img.over,ul.cssMenu a:hover a:hover a:hover img.over{display:inline} ul.cssMenu a:hover img.def,ul.cssMenu a:hover ul img.over,ul.cssMenu a:hover a:hover ul img.over,ul.cssMenu a:hover a:hover img.def,ul.cssMenu a:hover a:hover a:hover img.def{display:none} ul.cssMenu a:hover ul,ul.cssMenu a:hover a:hover ul{display:block} ul.cssMenu a:hover ul ul{display:none} ul.cssMenu span{ display:block; background-image:url(./images/arr_white.gif); background-position:right center; background-repeat: no-repeat; padding-right:12px;} ul.cssMenu li:hover>a>span{ background-image:url(./images/arrv_white.gif); } ul.cssMenu a:hover span{ _background-image:url(./images/arrv_white.gif)} ul.cssMenu ul span,ul.cssMenu a:hover table span{background-image:url(./images/arr_white.gif)} <!-- (c) 2009, PureCSSMenu.com -->




-->
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Randy

The reason why this is happening is because you have two instances of that code being displayed on your site. At the top and at the bottom. You need to be sure to apply the new HTML coding to both places. Once you do that, your menu should show up properly. Please let me know if you still have trouble with this. I can fix this for you.
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
Thanks Sanja,

I totally forgot about the menu at the bottom of the page. How come it changed in both places when I was using separate HTML widgets? By pasting the code in one HTML widget, it changes the other widget to the exact same code?
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Randy

For some reason, the original code was over-riding the new one. The new HTML codes were still there.. but it was just not being read because the old one took precedence. Unfortunately, I'm not that savvy enough to explain why - sorry!