Liquid templates: even/odd items in for loop

jekyll liquid
Adam Kiss picture Adam Kiss · Jan 24, 2012 · Viewed 19k times · Source

If I have a for loop in Liquid (using Jekyll), how can I target even (or odd) items only? I have tried:

{% for item in site.posts %}
    {% if forloop.index % 2 == 1 %}

but that doesn't seem to work. I have also tried:

(forloop.index % 2) == 1

and:

forloop.index - (forloop.index / 2 * 2) == 1

Answer

Alex Lande picture Alex Lande · Jan 24, 2012

I think you'll want to use the cycle tag for this. For example:

{% for post in site.categories.articles %}
   <article class="{% cycle 'odd', 'even' %}"></article>
{% endfor %}

If you want different HTML markup for each cycle:

{% for item in site.posts %}
  {% capture thecycle %}{% cycle 'odd', 'even' %}{% endcapture %}
  {% if thecycle == 'odd' %}
    <div>echo something</div>
  {% endif %}
{% endfor %}

You can find more information on it at Liquid for Designers, although the example there isn't particularly helpful. This Shopify support thread should also help.

Related questions

How does Jekyll date formatting work?

I'm using Jekyll to generate a simple site. I want the date field to display in the format 12 September 2011. I've found, through some creative googling, a bit of date-format manipulation, but nothing that seems to get me the month name. …

Read More
How to concatenate / append a string to another one in Jekyll / Liquid?

To be clear, assuming: {% assign my_var = "123" %} {% assign another_var = "456" %} I would like to append string to my_var to get something like 123 - 456 What I have tried so far: {% assign my_var = my_var + " - " + another_var %}

Read More
Does Liquid have a "does not contain" or "not in array" operator?

When calling items from and array in a Liquid template, how do you call does not contain or not in array?

Read More