コレクション一覧ページにページネーションを設置し、新着順に表示したい。

hdm
新規メンバー
2 0 0
{% paginate collections by 3 %}
  <ul class="collection-list-box">
{% for collection in collections reversed %}
 {% if collection.template_suffix == 'hoge' %}
    <li class="item-{{ collection.id }} collection-list-item">
    <a href="{{ collection.url }}"><img src="{{ collection.image | img_url: 'medium' }}">
    <span>{{ collection.title }}</span></a>
    </li>
          {% endif %}
          {% endfor %}
  </ul>

  {%- if paginate.pages > 1 -%}
<ul class="list--inline pagination">
  {% unless paginate.previous.is_link %}
    <li aria-hidden="true">
      <button class="btn btn--tertiary btn--narrow" disabled>
        {% include 'icon-arrow-left' %}
        <span class="icon__fallback-text">{{ 'general.pagination.previous' | t }}</span>
      </button>
    </li>
    {% else %}
    <li>
      <a href="{{ paginate.previous.url }}" class="btn btn--tertiary btn--narrow">
        {% include 'icon-arrow-left' %}
        <span class="icon__fallback-text">{{ 'general.pagination.previous' | t }}</span>
      </a>
    </li>
  {% endunless %}
  <li class="pagination__text">
    {{ 'general.pagination.current_page' | t: current: paginate.current_page, total: paginate.pages }}
  </li>
  {% unless paginate.next.is_link %}
    <li aria-hidden="true">
      <button class="btn btn--tertiary btn--narrow" disabled>
        {% include 'icon-arrow-right' %}
        <span class="icon__fallback-text">{{ 'general.pagination.next' | t }}</span>
      </button>
    </li>
  {% else %}
    <li>
      <a href="{{ paginate.next.url }}" class="btn btn--tertiary btn--narrow">
        {% include 'icon-arrow-right' %}
        <span class="icon__fallback-text">{{ 'general.pagination.next' | t }}</span>
      </a>
    </li>
  {% endunless %}
</ul>
  {%- endif -%}
{%- endpaginate -%}
{% endcomment %}

 

上記の方法でコードでページネーションはできたのですが表示順を新着順にする方法がわからず困っています。

また、テンプレートhoge以外のものも数に含まれており、空白のブロックができてしまいます。

原因がわからずに困っています。

0 件の「いいね!」
Jizo_Inagaki
航海者
399 139 413

「新着順」が「更新日順」という意味でしたら、現状ではLiquidを用いた並び替えでは不可能だと思われます。

https://community.shopify.com/c/Shopify-Discussion/Sort-collection-order-by-Published-or-Last-Modifi...

https://community.shopify.com/c/Shopify-Discussion/Sort-collection-order-by-Published-or-Last-Modifi...

少し古い上未検証ですが以下などは対応策検討の参考になるかもしれません。

https://community.shopify.com/c/Shopify-Design/Music-store-need-to-sort-by-release-date/td-p/261447

 

空白のブロックというのはわかりかねますが、想定したよりも多い数のページネーションが表示されるということでしたら以下のスレッドを参照ください。

https://community.shopify.com/c/%E6%8A%80%E8%A1%93%E7%9A%84%E3%81%AAQ-A/%E7%89%B9%E5%AE%9A%E3%81%AE%...

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
hdm
新規メンバー
2 0 0

現状新着順というのは難しいのですね・・・

 

空白というのはコレクションを{% paginate collections by 6 %}をつかいページネーションを付けた場合にすべてのコレクションが表示されてしまうので

{% if collection.template_suffix == 'hoge' %}で特定の条件のコレクションを表示したのですが、ページネーションですべてのコレクションを一度取得しているみたいで

条件分岐にはじかれたコレクションが表示自体はされないのですが、すべてのコレクションの数に合うようにページネーションが生成さ、余分な空白とページネーションができてしまっています。

0 件の「いいね!」
トップいいね!投稿者