# 商品タイプ一覧ページの作成方法について質問 **URL:** \ **Category:** 技術的なQ＆A\ **Created:** [April 14, 2021, 9:47am UTC](https://community.shopify.com/t/topic/43116 "2021-04-14T09:47:52Z")\ **Posts on this page:** 4\ **Page:** 1 ## AI-generated summary フロント側で「商品タイプ一覧ページ」「商品タイプ別ページ」を作れるか、また全商品タイプを一括取得できるかが主題。想定としては、商品タイプを大分類、コレクションを中分類、タグを色・サイズなどの種別として使いたいという相談だった。 回答では、Liquidだけで全商品を走査して商品タイプ一覧を作る方法はあるが、ページネーション上限や表示速度の面から非推奨とされた。代替として、商品タイプごとに自動コレクションを作成し、タグフィルターを組み合わせる構成が実用的と提案された。 推奨構成の例： ・商品タイプ＝大カテゴリー ・タグ1＝中カテゴリー ・タグ2＝色・サイズなど ・URLは /collections/tops/brouse,black,s のように絞り込み可能 また、商品タイプ一覧の単純な出力であれば Liquid の collection.all_types オブジェクトでリンク生成が可能と補足された。結論として、目的は「自動コレクション＋タグフィルター」でほぼ実現可能で、質問者もこの方針で試す意向を示しており、実質的に解決に向かっている。
**Author:** ![stm](https://avatars.discourse-cdn.com/v4/letter/s/aeb1de/32.png) [@stm](https://community.shopify.com/u/stm)\ **Post date:** [April 14, 2021, 9:47am UTC](https://community.shopify.com/t/topic/43116/1 "2021-04-14T09:47:52Z")
【質問】 管理画面ではなくフロント側で商品タイプを利用して、商品タイプ一覧ページ、商品タイプページの作成はできるでしょうか。 具体的には以下のような想定の場合、ショップに登録されている全ての商品タイプを呼び出すことは可能でしょうか。 （別システムの例になってしまいますが、WordPress の get\_categories のようなことができるのか？） ▼商品詳細 商品タイプ、コレクション、タグを使って階層のように商品を管理する想定 ・商品タイプ →大カテゴリー（例：トップス、ボトム、シューズ…etc） ・コレクション →中カテゴリー（例：ブラウス、Tシャツ、セーター…etc） ・タグ →種別（例：色、サイズ…etc） ▼画面イメージ 商品タイプ一覧ページ ・全ての商品タイプを表示する（例 トップス、ボトムス、シューズ…etc） ・商品タイプがクリックされたら該当の商品タイプページに移動する 商品タイプページ ・商品タイプに紐づくコレクションを表示する（例 ブラウス、Tシャツ、セーター…etc） ▼自動コレクションを利用する案 1.条件を商品タイプにして自動コレクションを作成し、中身が商品タイプになるコレクションを作成する 2.任意のページを作成し、1で作成したコレクションを表示することで商品タイプ一覧ページとする 自動コレクションを利用すれば商品タイプの一覧ページは実現できるかなと考えているのですが、もっと良い実装方法があれば知りたく思い質問させていただきました。 メインの質問と少しずれますが、階層のように分類する時にはこうした方が後からカスタマイズする時に楽だよという分類方法も教えていただけると助かります。 初めて構築するため初歩的な質問になりますが、回答いただけると幸いです。 ---
**Author:** ![\_osamu\_iwasaki](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/_osamu_iwasaki/32/272617_2.png) [@\_osamu\_iwasaki](https://community.shopify.com/u/_osamu_iwasaki)\ **Post date:** [April 15, 2021, 3:05am UTC](https://community.shopify.com/t/topic/43116/2 "2021-04-15T03:05:52Z")
Liquidだけで全商品を絞り込む方法はありますが、 いずれ規制されるであろう **paginate … by 50** オブジェクトの 上限を越えて使うことになってしまうため、スピード的にも将来的にもおすすめしません。 おそらくやりたいことは **自動コレクション** と **タグフィルター** で実現できるのではないかと思います。 **▼商品詳細** **・商品タイプ** → **大カテゴリー** （例：TOPS、BOTTOM、SHOES…etc） **・タグ1** → **中カテゴリー** （例：BROUSE、TSHIRTS、SWEATER…etc） **・タグ2** → **種別** （例：BLACK、YELLOW、S、M、L…etc） **▼商品一覧ページ** **・コレクションALL** →全ての商品を表示する（例： **/collections/all/** ） **・コレクションTOPS** →商品タイプTOPSのみで自動コレクション（例： **/collections/tops/** ） **・コレクションBOTTOM** →商品タイプBOTTOMのみで自動コレクション（例： **/collections/bottom/** ） **▼商品一覧ページをタグで絞り込み** **・コレクションTOPS + 中カテゴリー「BROUSE」** →全ての商品からBROUSEタグのみ表示する（例： **/collections/tops/brouse** ） **・コレクションTOPS + 中カテゴリー「BROUSE」+色「BLACK」** →全ての商品からBROUSEとBLACKタグを複合で表示する（例： **/collections/tops/brouse,black** ） **・コレクションTOPS + 中カテゴリー「BROUSE」+色「BLACK」+サイズ「S」** →全ての商品からBROUSEとBLACKとSタグを複合で表示する（例： **/collections/tops/brouse,black,s** ） ---
**Author:** ![\_osamu\_iwasaki](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/_osamu_iwasaki/32/272617_2.png) [@\_osamu\_iwasaki](https://community.shopify.com/u/_osamu_iwasaki)\ **Post date:** [April 15, 2021, 3:13am UTC](https://community.shopify.com/t/topic/43116/3 "2021-04-15T03:13:25Z")
> ショップに登録されている全ての商品タイプを呼び出す こちらですが、タイプとタグの複合検索しない前提であれば、 **collection.all\_types** オブジェクトを使うことでリンクは作れます。 [https://shopify.dev/docs/themes/liquid/reference/objects/collection](https://shopify.dev/docs/themes/liquid/reference/objects/collection) ![スクリーンショット 2021-04-15 12.11.29.png](https://canada1.discourse-cdn.com/shopifyforum/original/3X/5/5/55b76def5494e7b9d4ae235f620be1b7e927857d.png) ---
**Author:** ![stm](https://avatars.discourse-cdn.com/v4/letter/s/aeb1de/32.png) [@stm](https://community.shopify.com/u/stm)\ **Post date:** [April 16, 2021, 7:51am UTC](https://community.shopify.com/t/topic/43116/4 "2021-04-16T07:51:41Z")
分かりやすく階層表示について説明していただきありがとうございます。 タグとコレクションの使い所に迷っていたので大変助かりました。 商品にタグを複数つけてやりたいことに合わせてコレクションを作成したり、絞り込みを行うのがキモになりそうですね。 URLの階層もまさにこのようにしたい！というものでした。URLに入力するだけで一覧ページが生成されるなんて便利ですね。 タグフィルター色々試してみます。 **collection.all\_types** についてもありがとうございます。 単純な商品タイプ一覧が欲しい時にドキュメントを読んで使用してみたいと思います。