Link

<!-- Default -->
<a href="#">
    Home
</a>

<!-- Download -->
<a href="afvalkalender.pdf" class="download">
    Afvalkalender 2017
</a>

<!-- Extern -->
<a href="http://www.google.nl" class="extern" target="_blank">
    Een link naar Google
</a>

<!-- Icon -->
<a href="#">
    <span class="fas fa-search" aria-hidden="true"></span>
    <span class="sr-only">Zoeken</span>
</a>

<!-- Label -->
<a href="#">
    Zoeken
</a>

<!-- Iconlabel -->
<a href="#">
    <span class="fas fa-search" aria-hidden="true"></span>
    zoeken
</a>

<!-- Iconbadge -->
<a href="#">
    <span class="fas fa-search" aria-hidden="true"></span>
    <span class="sr-only">zoeken</span>
    <span class="dso-badge">4</span>
</a>

<!-- Iconlabelbadge -->
<a href="#">
    <span class="fas fa-search" aria-hidden="true"></span>
    zoeken
    <span class="dso-badge">4</span>
</a>

<a href="{{ url }}" {{{ifattr 'class' modifier }}} {{{ifattr 'target' modifier 'extern' '_blank' }}}>
  {{#if icon }}
    {{> '@icon' icon=icon }}
  {{/if}}
  {{#if iconOnly }}
    <span class="sr-only">{{ label }}</span>
  {{else}}
    {{ label }}
  {{/if}}
  {{#if badge }}
    {{> '@badge' badge }}
  {{/if}}
</a>
/* Default */
label: Home
url: '#'


/* Download */
label: Afvalkalender 2017
url: afvalkalender.pdf
modifier: download


/* Extern */
label: Een link naar Google
url: 'http://www.google.nl'
modifier: extern


/* Icon */
label: Zoeken
url: '#'
icon: fas fa-search
iconOnly: true


/* Label */
label: Zoeken
url: '#'


/* Iconlabel */
label: zoeken
url: '#'
icon: fas fa-search


/* Iconbadge */
label: zoeken
url: '#'
icon: fas fa-search
iconOnly: true
badge:
  label: 4


/* Iconlabelbadge */
label: zoeken
url: '#'
icon: fas fa-search
badge:
  label: 4


Externe links krijgen de class extern en een target="_blank"