ループ:forとforloop
forループとforloopオブジェクトで一覧表示を組み立て、件数制限や先頭・末尾の扱いを実装できる
最終確認: 2026-09
解説
受託の現場でなぜ必要か: この回では、forループ(配列を1件ずつ取り出してくり返す仕組み)で、一覧表示を組み立てられるようになります。
受託では、商品一覧・バリエーション・メニューなど、テーマの改修の多くがforの中の直しです。
forループとは
for item in arrayで、配列の要素を1件ずつ取り出してくり返します。elseを付けると、配列が空のときの表示を書けます。
「商品がありません」の文言は、ここに置きます。
先頭だけ・最後だけを扱うには
ループの中では、forloopという変数が使えます。forloop.firstとforloop.lastで、先頭と最後だけの処理を書けます。forloop.indexは1始まり、forloop.index0は0始まりの番号です。lengthは件数、rindex / rindex0は逆順の番号です(最後の要素で1または0)。
先頭だけ大きく・最後だけ区切りを消す・空なら文言を出す、の3つが書ければ一覧の改修は一通りできます。
件数を絞る・途中から回すには
limit: 4で件数を絞り、offset: 2で途中から始め、reversedで逆順にします。(1..5)のような範囲も回せます。break / continueで、途中で抜けたり飛ばしたりできます。offset: continueと書くと、前のループの続きから回せます。
発展:性能と入れ子のループ
ループの中で重い処理(all_productsの参照や大きなrender)を回すと遅くなります。
ループの外で済むことは、外で済ませます。
ループを入れ子にすると、内側では内側のforloopが見えます。
外側を見たいときはforloop.parentloopを使います。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。