Shopify cycle iteration to simplify

0
votes

I am trying to use the cycle in shopify to add a class to the first 4 divs, then a new class to the second 4 divs, then a new class to the 3rd group of divs.

Instead of typing like this

      {% cycle '<div class="1">', '<div class="1">', '<div class="1">', '<div class="1">', '<div class="2">', '<div class="2">', '<div class="2">', '<div class="2">', '<div class="3">', '<div class="3">', '<div class="3">', '<div class="3">', %}

Is there way to iterate this so that I can reduce typing, the classes go on to like 20 so that is a lot of typing?

1
loopslogicshopifyliquid

1 Answers

1
votes

You can try using something like this

{% for i in (1..20) %}
  <div class="{% if forloop.index < 5 %} class1{% endif %}{% if forloop.index >=5 and forloop.index < 9 %} class2{% endif %}{% if forloop.index >=9 and forloop.index <13 %}class3{% endif %}">class{{ forloop.index }}</div>
 {% endfor %}