Получите правильные результаты разбиения на страницы при скрытии недоступных продуктов

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

Решение 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. Не скрытие, а маркировка.

Вы также можете показать SOLD OUT рядом сваш продукт, а не скрывать его.На сегодняшний день это самое простое решение.

Answer 2

К сожалению, вы никак не можете изменить нумерацию страниц.Например, если у вас есть полная страница с распроданными товарами, товары не будут отображаться.

Единственный способ изменить это - создать отдельную «умную коллекцию», которая будет принимать товары с большим запасом, чем 0, изациклите этот вместо текущего.