I haven’t seen the way yet either in terms of making a custom renderer. Here’s what I ended up doing though:
First, instead of rendering the default menu() call, create a partial to render into:
// menu.phtml is partial, cms is module
$partial = array('menu.phtml', 'cms');
$this->navigation()->menu()->setPartial($partial);
echo $this->navigation()->menu()->render();
Then (from the docs), you can create a “custom” render like so:
// -- inside menu.phtml
foreach ($this->container as $page)
{
// this just prints a "<a>" or "<span>" tag
// depending on whether the page has a uri
echo $this->menu()->htmlify($page), PHP_EOL;
}
I ended up making what I originally had (a menu with one level of submenus) with this script:
// -- another menu.phtml
<ul class="navigation">
<?php
$html = array();
foreach ($this->container as $page)
{
$html[] = "<li>";
$html[] = $this->menu()->htmlify($page) . PHP_EOL;
if (!empty($page->pages))
{
$html[] = "<ul>";
foreach ($page->pages as $subpage)
{
$html[] = "<li>";
if ($href = $subpage->getHref()) $html[] = "<a href=\"{$href}\">";
else $html[] = "<span>";
$html[] = "<img src=\"/ui/cms/img/icons/edit.png\" alt=\"\"/>";
$html[] = $subpage->getLabel();
if ($href) $html[] = "</a>";
else $html[] = "</span>";
$html[] = "</li>";
}
$html[] = "</ul>";
}
$html[] = "</li>";
}
echo join(PHP_EOL, $html);
?>
</ul>
You could just change the markup in the partial and add your images/icons there.