Is it possible to make a function that would add a unique id to the <ul> at each level? This way, it would become easier to do targeted CSS theming to one menu level without subsequent menu levels inheriting the same styling.

Any help would be greatly appreciated. Thanks.

Comments

andregriffin’s picture

andregriffin CreditAttribution: andregriffin commented
Title: Add unique ID to each menu level » Add depth-specific class to each menu level

Changing title. Also, adding a class would be more semantically appropriate.

For example, I'd like to achieve:

<ul id="nice-menu-1">
  <li>
    <a>Level 1 Link</a>
    <ul class="nice-menu-level-2">
      <li>
        <a>Level 2 Link</a>
        <ul class="nice-menu-level-3">
          <li>
            <a>Level 3 Link</a>
          </li>
        </ul>
      </li>
    </ul>
  </li>
  <li>
    <a>Another Level 1 Link</a>
    <ul class="nice-menu-level-2">
      <li>
        <a>Another Level 2 Link</a>
      </li>
    </ul>
  </li>
</ul>