liquid shopify - 更改页面上显示的产品数量

时间:2016-04-11 17:30:55

标签: shopify liquid assign paginate

我想在用户点击按钮后更改shopify页面上显示的产品数量。

然而,点击按钮后没有任何反应。

是否因为液体无法在脚本标签中呈现?

// set 25 products display on the page by default 
{% assign number = 25 %} 
{% paginate collection.products by number %}

<div>
   // content of products description go here
</div>

//after user click on the button, it will change the number of products displayed on a page  

<span><strong>Show&nbsp;&nbsp;&nbsp;</strong></span>
  <button onclick="view()">50&nbsp;&nbsp;&nbsp;&nbsp; </button>  
  <span>100&nbsp;&nbsp;&nbsp;&nbsp;</span> 
  <span>All</span> 
{% endpaginate %}

<script>
    //after user click on the button, it will change the number of products displayed on a page to 5 items. 
   // However Nothing happens after I click on the button.   
    function view(){
        {% assign number = 5 %} 
        {% paginate collection.products by 5 %}
        {% endpaginate %}
    } 

1 个答案:

答案 0 :(得分:0)

您应该使用不同的模板。

创建几个集合模板,如

collection.12.liquid collection.24.liquid collection.48.liquid

在这些模板中,将collection.liquid和paginate产品的内容设为12,24和48

然后点击这些页面的链接,如

<div>
  Show: 
  <a href="{{collection.url}}?view=12">12</a>
  <a href="{{collection.url}}?view=24">24</a>
  <a href="{{collection.url}}?view=48">48</a>
</div>

使用?view= yiu将加载模板12,24或48,您可以将产品分页12,24或48