We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 22427
    • 793 Posts
    To be more specific:

    Add &levelClass=`button` and &rowTpl=`rowTplChunk` to your Wayfinder call.
    The rowTplChunk should be something like this:
    <li class="[[+wf.classnames]] has-sub"><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>

    So the menu items of first level are output like this:
    <li class="button1 has-sub"><a href="/" title=""><span>First level</span></a>....</li>

    and the items of second level like this:
    <li class="button2 has-sub"><a href="/" title=""><span>Second level</span></a>....</li>

    and so on.

    Now you need your dirty CSS:
    ul.navigation li.button1 > a {
        /* put here the rules you used in your class button */
    }
    
    You don't need any rules for the li.button2 and so on; they are just ignored.

      • 37914
      • 89 Posts
      Yes, that would do it smiley
      Thank you very much for your help!!

      Quote from: ottogal at Feb 04, 2013, 06:14 PM
      To be more specific:

      Add &levelClass=`button` and &rowTpl=`rowTplChunk` to your Wayfinder call.
      The rowTplChunk should be something like this:
      <li class="[[+wf.classnames]] has-sub"><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>

      So the menu items of first level are output like this:
      <li class="button1 has-sub"><a href="/" title=""><span>First level</span></a>....</li>

      and the items of second level like this:
      <li class="button2 has-sub"><a href="/" title=""><span>Second level</span></a>....</li>

      and so on.

      Now you need your dirty CSS:
      ul.navigation li.button1 > a {
          /* put here the rules you used in your class button */
      }
      
      You don't need any rules for the li.button2 and so on; they are just ignored.