Question

当产品不可用时，如何隐藏它？我真的很想弄清楚这一点，但是我当前的问题是分页。它的说法是有28个结果..当应该有24个结果（4个产品售罄）时。

这就是我的收藏模板中的内容。

{% assign number = section.settings.products_per_page %}

{% paginate collection.products by number %}

{% for product in collection.products %}
    {% if product.available %}
      {% include 'product-listing' %}
    {% endif %}
{% endfor %}

{% include 'pagination' %}

{% endpaginate %}

Answer 1

遗憾的是，您无法以任何方式修改分页。例如，如果您的整页都有售罄的产品，则不会显示任何产品。

修改此设置的唯一方法是创建一个单独的“智能集合”，该集合将采用库存量大于0的产品并将其循环而不是当前的那个。

Answer 2

解决方案1.使用您自己的分页。

您可以使用自己的分页。真的很简单。如果您具有这种结构：

<ul>
  {% for product in collection.products %}
    <li {% if forloop.index > 8 %}style="display: none;"{% endif %}>product</li>
  {% endfor %}
</ul>
<a class="showmore">show more</a>

...您可以使用此jQuery：

$(".showmore").click(function() {
  for (i = 0; i < 8; i++) { 
    if($(this).prev().find('li:hidden').length==0) $(this).remove();
    $(this).prev().find('li:hidden').first().css('display','block');
  }
});

请注意，在大型商店中，您可能需要将图像的“ src”属性放在“ data-src”属性中，并在切换/显示时将其替换。这样可以防止所有图像一次加载到概述中。

解决方案2.不是隐藏，而是标记。

您也可以在产品旁边显示“售罄”，而不是隐藏它。到目前为止，这是最简单的解决方案。

隐藏不可用的产品时获得正确的分页结果

2 个答案: