循环浏览一个集合中的所有产品 |购物答案

【问题标题】：Cycle through all products within a collection | SHOPIFY循环浏览一个集合中的所有产品 |购物
【发布时间】：2015-04-27 22:07:45
【问题描述】：

在 Shopify 中调整“上一个产品”和“下一个产品”功能时遇到问题。

我想设置它，以便“上一个”和“下一个”循环遍历所有产品，轮播样式。

一旦您进入最后一个产品，“下一个”将带您回到第一个产品。目前，一旦到达终点，您只能转到上一个产品并向后浏览列表。

有什么想法吗？

这是我的基本代码：

  {% if collection.previous_product %}

     {{ '«' | link_to: collection.previous_product }}

  {% endif %}

  {% if collection.next_product %}

    {% if collection.previous_product %} | {% endif %}

    {{ '»' | link_to: collection.next_product }}

  {% endif %}

【问题讨论】：

标签： javascript html shopify liquid

【解决方案1】：

试试这样的：

{% if collection.previous_product %}
  {{ '«' | link_to: collection.previous_product }}
{% else %}
  {% assign last_product_url = collection.products.last.url | within:collection %}
  {{ '«' | link_to: last_product_url }}
{% endif %}

{% if collection.next_product %}
  {{ '»' | link_to: collection.next_product }}
{% else %}
  {% assign first_product_url = collection.products.first.url | within:collection %}
  {{ '»' | link_to: first_product_url }}
{% endif %}

如果您的收藏中有超过 50 种产品，请注意collection.products is paginated。

See here 获取有关within 过滤器的信息。

【讨论】：

【解决方案2】：

我对 Shopify 不是很熟悉，但我查看了他们的文档，发现集合对象包括 colection.products_count 和 collection.products。如果collection.products 包含一个产品数组，并且它们的方法绑定到它们，你可以这样做：

{% if collection.previous_product %}

  {{ '«' | link_to: collection.previous_product }}

{% else %}

  {{ '«' | link_to: collection.products[collection.products_count - 1].url }}

{% endif %}

{% if collection.next_product %}

  {{ '»' | link_to: collection.next_product }}

{% else %}

  {{ '»' | link_to: collection.products[0].url }}

{% endif %}

我似乎找不到要测试的 shopify 沙箱，但假设 collection.products 返回一个数组，这应该可以工作。

【讨论】：