{% macro submenu(elements, link, name) -%}
  {% if elements %}
  <li class='has-sub'><a href="{{ SITEURL }}/{{link}}.html"><span>{{name}}</span></a>
  <ul> 
    {% for tag, articles in elements %}
    <li><a href="{{SITEURL}}/{{tag.url}}"><span>{{ tag }}</span></a></li>
    {% endfor %} 
  </ul>
  </li>
  {% endif %}
{%- endmacro %}

<div id="cssmenu">
<ul>
  <li class='has-sub'><a href="{{ SITEURL }}/">Articles</a>
  <ul>
  {% for article in articles %}  
    {% if loop.index < FEED_MAX_ITEMS %}
      <li><a href="{{ SITEURL }}/{{ article.url}}">{{ article.title }}</a></li>
    {% endif %}
  {% endfor %}
      <hr/>
      <li><a href="{{ SITEURL }}/archives.html">Archives</a>
  </ul>
  </li>

  {{ submenu(categories, 'categories', 'Catégories') }}

  <li class='has-sub'><a href="{{ SITEURL }}/"><span>À lire</span></a>
  <ul> 
    {% for page in pages %}
    <li><a href="{{SITEURL}}/{{page.url}}"><span>{{ page.title }}</span></a></li>
    {% endfor %} 
    {% if pages and LINKS %}
    <hr/>
    {% endif %}
    {% for link, target in LINKS %}
    <li><a href="{{target}}"><span>{{ link }}</span></a></li>
    {% endfor %} 
  </ul>
  </li>


{#
  {% if FEED or FEED_RSS %}
  <li class='has-sub'><a href="{{ SITEURL }}/#">S'abonner</a>
       <ul>
         {% if FEED %}
         <li><a href="{{ SITEURL }}/{{ FEED }}" rel="alternate">Flux ATOM</a></li>
         {% endif %}
         {% if FEED_RSS %}
         <li><a href="{{ SITEURL }}/{{ FEED_RSS }}" rel="alternate">Flux RSS</a></li>
         {% endif %}

         {% if categories %}
         {% for category, articles in categories %}
         <li><a href="{{SITEURL}}/{{CATEGORY_FEED_ATOM % (category)}}"><span>{{ category }}</span></a></li>
         {% endfor %} 
         {% endif %}
       </ul>
  </li>
  {% endif %}
#}

</ul>
</div>