Ruby 在Jekyll液体中对forloop.index使用模

我正在尝试设置一个循环，在我的索引页面上显示文章，以便它们适合skeleton.css框架。第一篇文章应该占据12列，并包含在它自己的行中。此后，每两个柱子应单独包装一行。我正在使用以下命令：

{% elsif forloop.index | modulo: 2 == 0 %}

…试图在每两个帖子周围创建一个行div。这似乎不起作用，因为在输出时，每个单独的post都被包装在一个row div中

<div class="posts">

    {% for post in site.posts %}
        {% if forloop.first == true %}

            <div class="row">
                <article class="twelve columns"></article>
            </div>

        {% elsif forloop.index | modulo:2 == 0 %}

            <div class="row">
                <article class="six columns"></article>
            </div>

        {% else %}

            <article class="six columns"></article>

        {% endif %}
    {% endfor %}

</div>

{site.posts%中的post为%s}
{%if-forloop.first==true%}
{%elsif forloop.index |模：2==0%}
{%else%}
{%endif%}
{%endfor%}

索引1：跳过

索引2：开始两篇文章包装

索引3：第二篇文章结尾

索引4：开始两篇文章包装

索引5：第二篇文章结尾

{site.posts%中的post为%s}
{%if-forloop.first==true%}
{%elsif forloop.index |模：2==0%}
{%else%}
{%endif%}
{%endfor%}

虽然这会带来一个新问题。它可能适用于3篇或5篇文章，但不适用于4篇或6篇文章

需要使用helper变量来跟踪最后一行div的开放性：

{% assign opendiv = false %}

<div class="posts">

    {% for post in site.posts %}

        {% assign remainder = forloop.index | modulo:2 %}

        {% if forloop.first == true %}

            <div class="row">
                <article class="twelve columns"></article>
            </div>

        {% elsif forloop.last == true and opendiv == false %}

            <div class="row">
                 <article class="six columns"></article>
            </div>

        {% elsif remainder == 0 %}

            {% opendiv = true %}
            <div class="row">
                <article class="six columns"></article>

        {% elsif opendiv == true %}

            {% opendiv = false %}
                <article class="six columns"></article>
            </div>

        {% endif %}
    {% endfor %}

</div>

{%assign opendiv=false%}
{site.posts%中的post为%s}
{%分配余数=forloop.index |模：2%}
{%if-forloop.first==true%}
{%elsif forloop.last==true和opendiv==false%}
{%elsif余数==0%}
{%opendiv=true%}
{%elsif opendiv==true%}
{%opendiv=false%}
{%endif%}
{%endfor%}

您的

{%elsif forloop.index | modulo:2==0%}

条件不正确，因为这样的控制结构中不允许使用管道。它最终解析为

{%elsif forloop.index%}

，这总是正确的

您可以这样做：

<div class="posts">
  {% for post in site.posts %}
    {% assign remainder = forloop.index | modulo: 2 %}
    {% if forloop.first == true %}
      <div class="row">
        <article class="twelve columns"></article>
      </div>
    {% elsif remainder == 0 %}
      <div class="row">
        <article class="six columns"></article>
      {% if forloop.last %}
      </div>
      {% endif %}
    {% else %}
        <article class="six columns"></article>
      </div>
    {% endif %}
  {% endfor %}
</div>

{site.posts%中的post为%s}
{%分配余数=forloop.index |模：2%}
{%if-forloop.first==true%}
{%elsif余数==0%}
{%if-forloop.last%}
{%endif%}
{%else%}
{%endif%}
{%endfor%}

这很有效，谢谢，谢谢你的解释。你知道为什么控制结构中不允许使用管道吗？

<div class="posts">
  {% for post in site.posts %}
    {% assign remainder = forloop.index | modulo: 2 %}
    {% if forloop.first == true %}
      <div class="row">
        <article class="twelve columns"></article>
      </div>
    {% elsif remainder == 0 %}
      <div class="row">
        <article class="six columns"></article>
      {% if forloop.last %}
      </div>
      {% endif %}
    {% else %}
        <article class="six columns"></article>
      </div>
    {% endif %}
  {% endfor %}
</div>