3

这似乎很容易,但是在研究和敲打了几个小时之后,我仍然无法弄清楚。我的目标是在 Shopify 集合网格中插入一个非产品 HTML 块,例如此处第 1 行第 3 列中的“享受免费陆运”块:

http://www.katespade.com/designer-handbags/handbags,default,sc.html

我的收藏网格设置为每页 3 列乘以 4 行,我希望用 3 个或更多产品替换所有收藏页面第 2 行第 1 列的块。

我需要修改的液体循环是:

    <ul class="product-grid clearfix">
    {% for product in collection.products %}
      <li{% cycle '', '', ' class="last-in-row"' %}>
        {% include 'product-grid-item' %}
      </li>
    {% endfor %}
    </ul>

有没有人有任何见解?

4

1 回答 1

2

欢迎来到堆栈溢出!:-)

首先,让我对其进行伪编码以确保我们在同一页面上,并且我的逻辑是正确的。

for each product in collection
{
    is this the 4th iteration of the loop?
    (in other words, is it the first item in the second row)
    {
        Add an <li> for the custom non-product block.
    }

    Add an <li> for the standard product block
}

如果该逻辑符合您的要求,那么这就是 Liquid 中的真实内容。

<ul class="product-grid clearfix">

{% for product in collection.products %}

    {% if forloop.index == 4 %}
        <li{% cycle '', '', ' class="last-in-row"' %}>
            {% include 'your-custom-block-element' %}
        </li>
    {% endif %}

    <li{% cycle '', '', ' class="last-in-row"' %}>
        {% include 'product-grid-item' %}
    </li>

{% endfor %}

</ul>

您可能已经注意到 Shopify 默认处理基于 1 的索引。这就是我们寻找forloop.index == 4. 在几乎所有其他语言中,我们都会处理从零开始的索引并检查是否forloop.index == 3.

如果这个约定让你感到困惑,你总是可以用forloop.index0零来检查循环的索引。;-)

请让我知道这是否对您有用。祝你好运!

于 2013-01-12T01:57:51.877 回答