We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 28121
    • 107 Posts
    I have a template with almost nothing in it apart from a Top Navigation Menu using Wayfinder.

    I almost have this figured out and am amazed at how powerful WF is.
    To show people which section of the site they are browsing, I am using thr &selfClass
    parameter and have called it `iamhere`

    My Wayfinder is as follows

    <div id="topnav">
     [!Wayfinder?startId=`0` &level=`1` &rowClass=`topnav` &selfClass=`iamhere`!]
      </div>
    


    MY problem is 2 fold.
    1. Wayfinder keeps on applying a class ’active’ when I want it called ’iamhere’.
    2. Assuming ’iamhere’ is working, do I have my CSS below set up correctly?


    My CSS is as follows
    #topnav .iamhere {
    	background-color:#9C0;
    	color: #960;
    }
    
    
    #topnav{
    	background-color: #036;
    	height: 52px;
    			}
    
    
    #topnav{
    	font: normal 15px;
    	width: 700px;
    	font-family: "Times New Roman", Times, serif;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    
    
    #topnav li{
    display: inline;
    }
    
    #topnav li a{
    	float: left;
    	color: #CCC;
    	padding: 16px 25px; /*padding of tabs*/
    	text-decoration: none;
    	background-color:#036;
    	border-right: solid 1px #039;
    }
    
    
    
    #topnav li a:visited{
    	color: #CCC;
    }
    
    #topnav li a:hover{
    	color: #FFF;
    	background-color: #002B82;
           /*background-image: url(../images/pinkbgover.gif);background image swap on hover*/
    }
    
    
      • 26016
      • 561 Posts
      Hi,
      I think I see what you mean here. With &selfClass, you’d like the class to apply only to the exact item, rather than the item and its parents.

      &hereClass is "active" by default, though, and I think that’s what’s happening. If you want to get rid of all instances of "active", try adding this to your call:

      &hereClass=``

      As to whether your CSS will work, I’d really have to see the site, but it might be OK. If not, try something very specific such as:

      #topnav li.iamhere a {
      background-color:#9C0;
      color: #960;
      }

      Good luck, Dave
        MODx and Wordpress development
        Linux, PHP 5.2, MySQL 5.0, Evo 1.05, Revo 2.08-pl, Firefox 4
        • 28121
        • 107 Posts
        Hi Dave

        Thanks for your help. I’m planning on ooking into this at the weekend with your post and a large bucket of coffee :O)