This code should be saved to a snippet, and then the snippet called in the layout. It works to any level of page depth, and does not get confused by slug names.

<?php
 
function stackup($page, $level, &$astack)
  {
  $ancestor = $page->parent;
  if ($ancestor)
    {
    $astack[$level + 1] = $ancestor;
    stackup($ancestor, $level + 1, $astack);
    }
  }
 
function unstack($current, $max, $stack)
  {
  $here = $stack[$current];
  $next = $stack[$current + 1];
  $childs = $here->children();
  $count = count($childs);
  if ($count > 0)
    {
    echo '<ul>'."\n";
    foreach ($childs as $child)
      {
      if ($child->breadcrumb == $next->breadcrumb)
        {
        echo '<li>'.$child->link('', 'class="current"')."\n";
        if ($current < $max) {
          unstack($current + 1, $max, $stack);
          echo '</li>'."\n";
          }
        else echo '<li>'.$child->link().'</li>'."\n";
        }
      else echo '<li>'.$child->link().'</li>'."\n";
      }
    echo '</ul>'."\n";
    }
  }
 
$astack[0] = $this;
stackup($this, 0, $astack);
$bstack = array_reverse($astack);
$lev = count($bstack) - 1;
if ($lev == 0) echo '<ul><li>'.$bstack[0]->link('', 'class="current"')."\n";
else echo '<ul><li>'.$bstack[0]->link()."\n";
unstack(0, $lev, $bstack);
echo '</li></ul>'."\n";
 
?>

This navigation isolates the “Homepage” (or whatever you have called the root page in Wolf) on its own level. To make “Homepage” and the other top-level entries appear on the same level, you can use CSS like this:

#sidenav ul {
 padding: 0 0 0 0px;
 margin: 0;
 list-style-type: none;
}
#sidenav ul ul ul {
 padding: 0 0 0 10px;
 margin: 0;
 list-style-type: none;
}

The first <ul> has zero left padding and so does the second <ul>, but the third and subsequent levels get 10px each (ie. 10px for the 3rd, 20px for the 4th, etc).

[HT: peter_b ]