Can I insert content after every third item in a Squarespace JSONT repeated loop?

Question

How can I add a new row after 3 items in a repeat loop? The repeat loop is:

<div class="row">
    {.repeated section items}
    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 gallery-item">
        {.image?}<img class="img-responsive loading" {@|image-meta} />{.end}
    </div>

    {.equal? @index 3}
    </div><div class="row separator">
    {.end}
    {.end}
</div>

I can add a row after the first three items, but I want to add this after each third element

{.equal? @index 3}
</div><div class="row separator">
{.end}

Edit: I don't find any information from this in the docs.

Answer 1

As far as I know there's not a built in way to say something like "every third item". But you're on the right track. You can preset the intervals depending upon your intended page size. To keep your template a bit simplified you can use a block partial:

blog-separator.block

</div><div class="row separator">

blog.list

{.equal? @index 3}
   {@|apply blog-separator.block}
{.end}
{.equal? @index 6}
   {@|apply blog-separator.block}
{.end}
{.equal? @index 9}
   {@|apply blog-separator.block}
{.end}