Skip to content

Iterators

Iteration tags enable you to execute blocks of code repeatedly, allowing for efficient handling of lists, arrays, or other iterable data. These tags are essential for dynamically generating content based on the data provided, such as looping through items in a collection, displaying lists, or processing repetitive tasks. By leveraging iteration tags, you can streamline your templates and ensure content is rendered based on the available data. Below is a comprehensive guide on how to effectively utilize these tags to enhance your templates' functionality and performance.

for Loop

The for loop repeatedly executes a block of code. For a full list of attributes available within a for loop, refer to the forloop object.

Example: 

{% for product in collection.products %}
  {{ product.title }}
{% endfor %}

Output: 

hat shirt pants

else Clause

Specifies a fallback case for a for loop, which will run if the loop has zero length.

Example: 

{% for product in collection.products %}
  {{ product.title }}
{% else %}
  The collection is empty.
{% endfor %}

Output: 

The collection is empty.

break Tag

The break tag halts the loop's progression the moment it is encountered, bringing the iteration to an immediate end.

Example: 

{% for i in (1..5) %}
  {% if i == 4 %}
    {% break %}
  {% else %}
    {{ i }}
  {% endif %}
{% endfor %}

Output: 

1 2 3

continue Tag

Causes the loop to skip the current iteration when it encounters the continue tag.

Example: 

{% for i in (1..5) %}
  {% if i == 4 %}
    {% continue %}
  {% else %}
    {{ i }} 
  {% endif %}
{% endfor %}

Output: 

1 2 3 5

for Loop Parameters

limit

Limits the loop to the specified number of iterations.

Example: 

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit:2 %}
  {{ item }}
{% endfor %}

Output: 

1 2

offset

Begins the loop at the specified index.

Example: 

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array offset:2 %}
  {{ item }}
{% endfor %}
Output: 
3 4 5 6

To resume a loop from the point where the previous one using the same iterator stopped, use the special keyword continue.

Example: 

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit: 3 %}
  {{ item }}
{% endfor %}

<br>

{% for item in array limit: 3 offset: continue %}
  {{ item }}
{% endfor %}

Output: 

1 2 3
4 5 6

range

Specifies a sequence of numbers for the loop to process. The range can be set using either literal values or variables and may also be sourced directly from a variable.

Example: 

{% for i in (3..5) %}
  {{ i }}
{% endfor %}
<br>
{% assign num = 4 %}
{% assign range = (1..num) %}
{% for i in range %}
  {{ i }}
{% endfor %}

Output: 

3 4 5
1 2 3 4

reversed

Flips the loop's order, running it in reverse. Note that the spelling of this flag differs from the reverse filter.

Example: 

<!-- if array = [1,2,3,4,5,6] -->
{% for item in array reversed %}
  {{ item }}
{% endfor %}

Output: 

6 5 4 3 2 1

forloop Object

The forloop object provides information about a parent for loop.

Example: 

{% assign smoothie_flavors = "orange, strawberry, banana" | split: ", " %}

{% for flavor in smoothie_flavors -%}
  {%- if forloop.length > 0 -%}
    {{ flavor }}{% unless forloop.last %}-{% endunless -%}
  {%- endif -%}
{% endfor %}

Output: 

orange-strawberry-banana

forloop Properties

  • length: The total number of iterations in the loop.
  • parentloop: The parent forloop object. If the current for loop isn’t nested inside another for loop, then nil is returned.
  • index: The 1-based index of the current iteration.
  • index0: The 0-based index of the current iteration.
  • rindex: The 1-based index of the current iteration, in reverse order.
  • rindex0: The 0-based index of the current iteration, in reverse order.
  • first: Returns true if the current iteration is the first. Returns false if not.
  • last: Returns true if the current iteration is the last. Returns false if not.

cycle Tag

The cycle tag loops through a group of strings and prints them in the order that they were passed as arguments. Each time cycle is called, the next string argument is printed.

Example: 

{% cycle "one", "two", "three" %} <br>
{% cycle "one", "two", "three" %} <br>
{% cycle "one", "two", "three" %} <br>
{% cycle "one", "two", "three" %} <br>

Output: 

one
two
three
one

Cycle Groups

cycle accepts a “cycle group” parameter in cases where you need multiple cycle blocks in one page. If no name is supplied for the cycle group, then it is assumed that multiple calls with the same parameters are one group.

Example: 

{% cycle "first": "one", "two", "three" %}  <br>
{% cycle "second": "one", "two", "three" %} <br>
{% cycle "second": "one", "two", "three" %} <br>
{% cycle "first": "one", "two", "three" %}  <br>

Output: 

one
one
two
two

Uses for cycle

  • Applying odd/even classes to rows in a table.
  • Applying a unique class to the last product thumbnail in a row.