Shopify After 4 Products add a Horizontal Break

Question

我正在尝试弄清楚如何在 Shopify 产品循环中的 4 个产品之后添加水平分隔符。这可能吗？我查看了他们的文档，但没有显示对循环进行计数或迭代的可能性。

目前我的循环如下所示：

{% if collection.all_products_count > 0 %}
  <div class="w-col w-col-12">
    <div class="product-feed w-clearfix">
        {% for product in collection.products %}
          <a class="product product-collection w-inline-block" href="{{ product.url | within:collection }}">
            <div class="reveal">
              <img src="{{ product.featured_image | product_img_url: 'original' }}" alt="{{ product.title | escape }}" class="product-photo">
              <img src="{{ product.images.last | product_img_url: 'original' }}" alt="{{ product.title | escape }}" class="hidden">
            </div>
            <h3 class="product-title">{{ product.title }}</h3>
            <div class="product-price">{{ product.price | money }}</div>
            <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
          </a>
        {% endfor %}
    </div>
    {% assign count = paginate.pages %}
      {% for part in (1..count) %}
      <li {% if paginate.current_page == part %}class="active"{% endif %}><a href="{{ collection.url }}?page={{ forloop.index }}">{{ forloop.index }}</a></li>
      {% endfor %}
    {% else %}
    <p>Sorry, there are no products in this collection</p>
  {% endif %}

Answer 1

很公平的解释是您没有正确阅读文档。参考这个：- https://help.shopify.com/themes/liquid/objects/for-loops

让这个工作的直接方法是在 {% endfor %}

之前添加以下行

{% cycle '','','','<hr>' %} // 或者 <br> 如果你喜欢

每次 forloop 第 4 次迭代时，都会添加

<hr>。有关此的更多信息 - https://help.shopify.com/themes/liquid/tags/iteration-tags#cycle

Shopify After 4 Products add a Horizo​​ntal Break

Shopify After 4 Products add a Horizontal Break

html

liquid

shopify

Shopify After 4 Products add a Horizontal Break