Iteratietags
Iteratietags worden gebruikt om een codeblok meerdere keren achter elkaar uit te voeren.
voor
Voert een codeblok herhaaldelijk uit. Het wordt meestal gebruikt om de items in een matrix of een woordenboek te herhalen.
Binnen het for tag-blok is het object forloop beschikbaar.
Code
{% for child_page in page.children %}
<a href={{ child_page.url }}>{{ child_page.title }}</a>
{% endfor %}
Uitvoer
<a href=/parent/child1/>Child 1</a>
<a href=/parent/child2/>Child 2</a>
<a href=/parent/child3/>Child 3</a>
Parameters
Deze parameters van for kunnen alleen of in combinatie worden gebruikt.
limit
Sluit de lus na een bepaald aantal items af.
Code
{% for child_page in page.children limit:2 %}
<a href={{ child_page.url }}>{{ child_page.title }}</a>
{% endfor %}
Uitvoer
<a href=/parent/child1/>Child 1</a>
<a href=/parent/child2/>Child 2</a>
offset
Start de lus vanaf de opgegeven index op.
Code
{% for child_page in page.children offset:1 %}
<a href={{ child_page.url }}>{{ child_page.title }}</a>
{% endfor %}
Uitvoer
<a href=/parent/child2/>Child 2</a>
<a href=/parent/child3/>Child 3</a>
range
Definieert een getallenbereik om in een lus te doorlopen.
Code
{% assign n = 4 %}
{% for i in (2..n) %}
{{ i }}
{% endfor %}
{% for i in (10..14) %}
{{ i }}
{% endfor }}
Uitvoer
2 3 4
10 11 12 14
reversed
Herhaalt in de lus in omgekeerde volgorde, te beginnen vanaf het laatste item.
Code
{% for child_page in page.children reversed %}
<a href={{ child_page.url }}>{{ child_page.title }}</a>
{% endfor %}
Uitvoer
<a href=/parent/child3/>Child 3</a>
<a href=/parent/child2/>Child 2</a>
<a href=/parent/child1/>Child 1</a>
cycle
Werkt de lus af voor een groep tekenreeksen en voert deze uit in de volgorde waarin ze als parameters zijn doorgegeven. Telkens als de cyclus wordt aangeroepen, wordt de volgende tekenreeks uitgevoerd die is doorgegeven als parameter.
Code
{% for item in items %}
<div class={% cycle 'red', 'green', 'blue' %}> {{ item }} </div>
{% end %}
Uitvoer
<div class=red> Item one </div>
<div class=green> Item two </div>
<div class=blue> Item three </div>
<div class=red> Item four </div>
<div class=green> Item five</div>
tablerow
Genereert een HTML-tabel. Deze parameter moet zijn ingesloten tussen de HTML-codes <table> openen en </table> sluiten.
Binnen het codeblok tablerow is tablerowloop beschikbaar.
Code
<table>
{% tablerow child_page in page.children %}
{{ child_page.title }}
{% endtablerow %}
</table>
Uitvoer
<table>
<tr class=row1>
<td class=col1>
Child Page 1
</td>
<td class=col2>
Child Page 2
</td>
<td class=col3>
Child Page 3
</td>
<td class=col4>
Child Page 4
</td>
</tr>
</table>
Parameters
Deze parameters van tablerow kunnen alleen of in combinatie worden gebruikt.
Uitvoer
<table>
<tr class=row1>
<td class=col1>
Child Page 1
</td>
<td class=col2>
Child Page 2
</td>
</tr>
<tr class=row2>
<td class=col3>
Child Page 3
</td>
<td class=col4>
Child Page 4
</td>
</tr>
</table>
Code
<table>
{% tablerow child_page in page.children cols:2 %}
{{ child_page.title }}
{% endtablerow %}
</table>
Geeft aan hoeveel rijen de gegenereerde tabel moeten hebben.
cols
limit
Sluit de lus na een bepaald aantal items af.
Code
<table>
{% tablerow child_page in page.children limit:2 %}
{{ child_page.title }}
{% endtablerow %}
</table>
Uitvoer
<table>
<tr class=row1>
<td class=col1>
Child Page 1
</td>
<td class=col2>
Child Page 2
</td>
</tr>
</table>
offset
Start de lus vanaf de opgegeven index op.
Code
<table>
{% tablerow child_page in page.children offset:2 %}
{{ child_page.title }}
{% endtablerow %}
</table>
Uitvoer
<table>
<tr class=row1>
<td class=col1>
Child Page 3
</td>
<td class=col2>
Child Page 4
</td>
</tr>
</table>
range
Definieert een getallenbereik om in een lus te doorlopen.
Code
<table>
{% tablerow i in (1..3) %}
{{ i }}
{% endtablerow %}
</table>