コレクション内の並び順で売り切れ商品を最後に表示する方法

Topic summary

コレクション内で在庫のある商品を通常の並び順で表示し、売り切れ商品のみを最後にまとめて表示する方法についての質問です。

試した方法:

  • ループ処理で在庫切れ商品のIDを配列に保存し、後から表示する方法を試したが、ページネーション機能がうまく動作しない問題が発生
  • 海外フォーラムの方法も試したが、各ページごとに「在庫あり→在庫なし」の順で表示されてしまい、1ページ内での並び替えができない

現状の課題:

  • paginateタグで使用できる配列が決まっているため、並び順の変更が困難
  • 例:1ページ20商品表示の設定で在庫切れ商品がある場合、在庫のある商品のみ10商品しか表示されない

提案された解決策:

  • 手動で在庫切れ商品を最後に並べるコレクションを作成する方法(少し手間がかかる)

質問者は引き続き、Liquidコードでの解決方法を探しています。

Summarized with AI on November 20. AI used: claude-sonnet-4-5-20250929.

いつもお世話になっております。

コレクション内の並び順で在庫のある商品は通常の並び順のままにしておき、売り切れの商品のみをまとめて最後に表示する方法をLiquidのコード編集で対応できないでしょうか?

  1. コレクション内の商品を表示するループ処理の際に、在庫が切れていた場合は商品を表示せず、在庫切れ商品のIDを配列として保存。
  2. ループが終わった後にもう一度、配列に入れておいた在庫切れ商品のみを表示

といったコードを試してみたのですが、ページネーションがおかしくなってしまい、うまくいきませんでした。

(例えば1ページに20商品表示させる設定になっていても、在庫ぎれの商品があった場合、在庫のある商品10商品しか表示されません)

もしわかる方がいらっしゃいましたら、教えてください。

よろしくお願いいたします。

るんさま

はじめまして、フルバランスの渡邉です。

ご質問を確認いたしました。

在庫のある商品が先に表示されたほうが買いやすいですよね。

海外のフォーラムにてliquidで制御する方法が載っておりましたので、なにかヒントになるかもしれません。

https://community.shopify.com/topic/1785852

また、少々手間にはなりますが、手動のコレクションを作成して在庫切れ商品を最後に並ベる方法もあるかと存じます。

ご参考になりましたら幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

フルバランス 渡邉

2 Likes

フルバランス

渡邉様

ご回答ありがとうございます。

教えていただいたページをみてみました。

参考になりましたが、やはりページネーションがうまくいきませんでした。

教えていただいたページの方法を試すと、

1ページ目:在庫のある商品、在庫のない商品の順

2ページ目:在庫のある商品、在庫のない商品の順

のような表示となり、1つのページ内で表示順を変更することはできましたが、在庫のある商品全てを表示した後、在庫のない商品を表示するといったことはできませんでした。

paginateタグの外側でコレクションの並び順を変更する方法も考えましたが、paginateタグで使用できる配列が決まっているようなので、そのような方法もやはり難しいでしょうか?

もしわかりましたらこちらも教えていただけると助かります。

よろしくお願いいたします。