liquid shopify - изменить количество продуктов, отображаемых на странице

Question

Я хотел бы изменить количество продуктов, отображаемых на странице в магазине, после того, как пользователь нажмет на кнопку.

Однако ничего не происходит после того, как я нажму кнопку.

Это потому, что жидкость не может быть отображена в теге скрипта?

// 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 %} 
    } 

Answer 1

Вы должны сделать это с помощью различных шаблонов.

Создать несколько шаблонов коллекции как

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

в этих шаблонах, поставить содержание collection.liquid и постраничной продукты как 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