# 商品ソートがトップページで機能しない

**URL:** <https://community.shopify.com/t/topic/37749>\
**Category:** 技術的なQ＆A\
**Created:** [February 28, 2021, 7:35am UTC](https://community.shopify.com/t/topic/37749 "2021-02-28T07:35:26Z")\
**Posts on this page:** 4\
**Page:** 1

## AI-generated summary

TOPページに全商品を表示するようテーマをカスタマイズしたところ、コレクションページでは動く商品ソートがTOPでは機能しない問題。提示された`collection-sorting.liquid`自体は同じでも、TOPではプルダウンの選択肢が出ず、ソート用データが渡っていない状態と整理された。

主な見解:
- コレクションページでは現在のコレクション情報が`collection`オブジェクトに入るが、TOPページでは通常これが存在しない。
- そのため`collection.sort_by`や`collection.sort_options`が空になり、JS以前にLiquid側で必要な値を生成できていない可能性が高い。

提案された対応:
- jQueryに`alert`や`console.log`を入れて値の受け渡しを確認する。
- `/collections/all`の実装を参考にする。
- TOPで表示する場合は、どのコレクションを使うか明示的に指定する。複数コレクション横断なら各コレクションを個別に処理する必要がある可能性がある。`shop.collections_count`も参照先として提示された。

結論は未解決で、TOP用に`collection`依存の実装を見直す必要がある。

<div class="post-metadata">

**Author:** ![art\_o\_shi](https://avatars.discourse-cdn.com/v4/letter/a/4491bb/32.png) [@art\_o\_shi](https://community.shopify.com/u/art_o_shi)\
**Post date:** [February 28, 2021, 7:35am UTC](https://community.shopify.com/t/topic/37749/1 "2021-02-28T07:35:26Z")

</div>

テーマをカスタマイズしてTOPページに全商品リストを表示させたのですが、テーマに実装されているソート機能がTOPページでは機能しません。

コレクションページでは問題なく動作しますので、下記のcollection-sorting.liquidをカスタマイズしないといけないと思われるのですが、

どこを編集すればいいか分かりません。

分かる方がいましたら、ご教示いただけますと幸いです。

{% assign sort\_by = collection.sort\_by | default: collection.default\_sort\_by %} {{ 'collections.sorting.title' | t }}{% for option in collection.sort\_options %} {{ option.name }} {% endfor %}

ソート機能の読み込み側のソースは以下のようになっており、TOPページ、collectionページともに違いはありません。

{% if collection.description != blank %}

# {{ collection.title }}

{{ collection.description }}

{% include 'collection-sorting' %} {% include 'toggle-filters' %}

{% else %}
# {{ collection.title }}

{% include 'collection-sorting' %} {% include 'toggle-filters' %}
{% endif %}

---

<div class="post-metadata">

**Author:** ![junichiokamura](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/junichiokamura/32/299737_2.png) [@junichiokamura](https://community.shopify.com/u/junichiokamura)\
**Post date:** [March 9, 2021, 10:27am UTC](https://community.shopify.com/t/topic/37749/2 "2021-03-09T10:27:41Z")

</div>

おそらくですが、最後のJQueryの関数に渡しているソートのキーがTOPだと渡せていないので、常にデフォルトのソート順になっているのではと思います。

JQueryの関数に、alert やconsole.logを入れて、関数呼び出しをでバックしてみてはどうでしょうか？

---

<div class="post-metadata">

**Author:** ![art\_o\_shi](https://avatars.discourse-cdn.com/v4/letter/a/4491bb/32.png) [@art\_o\_shi](https://community.shopify.com/u/art_o_shi)\
**Post date:** [April 4, 2021, 4:08am UTC](https://community.shopify.com/t/topic/37749/3 "2021-04-04T04:08:06Z")

</div>

コメントいただきありがとうございます。  
いろいろ試してみましたが、解決できませんでした。

「常にデフォルトのソート順になっているのではと思います。」

というより、トップだとプルダウンにリストが表示されないので、  
そもそもデータを渡せていないようです。

---

<div class="post-metadata">

**Author:** ![junichiokamura](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/junichiokamura/32/299737_2.png) [@junichiokamura](https://community.shopify.com/u/junichiokamura)\
**Post date:** [April 5, 2021, 10:44am UTC](https://community.shopify.com/t/topic/37749/4 "2021-04-05T10:44:38Z")

</div>

コレクションページだと、今選んでいるコレクションが、 {{ collection }} オブジェクトに挿入されますが、TOPページだとそれがないので、データが空なのではと思います。

/collection/all のページのコードを参考にしてみてください。

TOPでコレクション未選択でコレクションの商品を表示するのは、 {{ collections[1].product }} のような感じで、まずどのコレクションを使うか指定する必要があると思います。

コレクション横断にする場合はこれをcollectionの数分回します。 ストアのコレクションの数は、shop.collections\_count で取れると思います。

[https://shopify.dev/docs/themes/liquid/reference/objects/shop#shop-collections\_count](https://shopify.dev/docs/themes/liquid/reference/objects/shop#shop-collections_count)
