Shopify 在首页对产品进行排序

Question

我发现 this code 允许用户对 collections 页面上的产品列表进行排序。我尝试了首页上的代码，但是当我单击下拉菜单时，它会将我重定向到一个新页面，但该页面仍然使用与以前相同的顺序。

有什么我想念的吗？如何将排序带到首页？

Answer 1

据我目前所见，只有在 collections 页面上才能执行排序。如果您愿意放弃标准的浏览器下拉功能，这应该适合您（请注意，您需要使用 js/css 使其成为下拉菜单）：

<div class="form-horizontal sort-large">
  <p>Sort By</p>
  <a href="" id="SortBtn">{{ 'collections.sorting.title' | t }}</a>
  <ul id="SortList">
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=manual">{{ 'collections.sorting.featured' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=best-selling">{{ 'collections.sorting.best_selling' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=title-ascending">{{ 'collections.sorting.az' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=title-descending">{{ 'collections.sorting.za' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=price-ascending">{{ 'collections.sorting.price_ascending' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=price-descending">{{ 'collections.sorting.price_descending' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=created-descending">{{ 'collections.sorting.date_descending' | t }}</a></li>
    <li><a href="{% if template == 'index' %}collections/all/{% endif %}?sort_by=created-ascending">{{ 'collections.sorting.date_ascending' | t }}</a></li>
  </ul>
</div>

基本上它所做的只是 link 到排序的 collection 页面（无论您在首页还是 Collections 页面）。如果您需要 link 到特定的 collection 然后在该 collection 中排序，您可能需要不同的方法。

Shopify 在首页对产品进行排序

Shopify sort products on front page

shopify