# コレクションページに複数コレクションを表示した場合のフィルターについて

**URL:** <https://community.shopify.com/t/topic/90672>\
**Category:** 技術的なQ＆A\
**Created:** [January 12, 2022, 5:48am UTC](https://community.shopify.com/t/topic/90672 "2022-01-12T05:48:41Z")\
**Posts on this page:** 4\
**Page:** 1

## AI-generated summary

Shopifyのコレクションページで2つのコレクション（○○○-1／○○○-2）を並列表示した際、商品フィルター（絞り込み）が後者にのみ適用される問題。テーマはCanopy、表示はLiquidで2つのforループを複製して実現済み。

結論：Shopifyには同一ページの引数によるフィルター条件を複数コレクションへ同時適用する機能がなく、現状の仕組みでは「不可」。フィルターはページのコレクションコンテキストに紐づくため、複数コレクションに跨った適用はできない。

代替案：Search機能をAjaxでJSON返却に設定し、検索を2回行って結果をJavaScriptで合成・描画すれば、複数コレクション相当の一覧にフィルタリングを適用可能。

対応・結果：質問者は同一ページへの2コレクション掲載を見送り、スレッドは解決。未解決の主要論点は特になし。

<div class="post-metadata">

**Author:** ![oriori](https://avatars.discourse-cdn.com/v4/letter/o/3e96dc/32.png) [@oriori](https://community.shopify.com/u/oriori)\
**Post date:** [January 12, 2022, 5:48am UTC](https://community.shopify.com/t/topic/90672/1 "2022-01-12T05:48:41Z")

</div>

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

Shopify初心者のためご指導いただけますと幸いです。

コレクションページに2つコレクションを表示させたいと思い、

表示するところまではできました。

ただし、フィルターの絞り込みの対象になっているコレクションが、

片方（後に記述している方）しか対象となっていないようなのです。

フィルターにどちらも対象にとされるには、どうすればよろしいでしょうか。

コレクションを追加した記述は下記の通りです。

単純に、表示させたいコレクション名を変えて、同じソースを繰り返しています。

絞り込みの対象になっているのは、「○○○-2.products」のみのようです。

**\<１つ目のコレクション\>**

{% if collection.products.size \> 0 %}

{% capture product\_blocks %} \*\*{%- for product in collections.○○○-1.products -%}\*\* {% render 'product-block', product: product, max\_cols: section.settings.products\_per\_row, min\_cols: section.settings.mobile\_products\_per\_row %} {%- endfor -%} {% endcapture %}

{%- if product\_blocks contains ‘product-block\_\_weight-value’ -%}  
{{ product\_blocks | replace: ‘

’, ‘
&nbsp;
’ }}  
{%- else -%}  
{{ product\_blocks }}  
{%- endif -%}

{%- for i in (1..section.settings.products\_per\_row) -%}

{%- endfor -%}
{% else %}

{{ 'collections.general.empty' | t }}

{% endif %}

**\<2つ目のコレクション\>**  
{% if collection.products.size \> 0 %}

{% capture product\_blocks %}  
**{%- for product in collections.○○○-2.products -%}**  
{% render ‘product-block’, product: product, max\_cols: section.settings.products\_per\_row, min\_cols: section.settings.mobile\_products\_per\_row %}  
{%- endfor -%}  
{% endcapture %}

{%- if product\_blocks contains ‘product-block\_\_weight-value’ -%}  
{{ product\_blocks | replace: ‘

’, ‘
&nbsp;
’ }}  
{%- else -%}  
{{ product\_blocks }}  
{%- endif -%}

{%- for i in (1..section.settings.products\_per\_row) -%}

{%- endfor -%}
{% else %}

{{ 'collections.general.empty' | t }}

{% endif %}
* * *

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

---

<div class="post-metadata">

**Author:** ![oriori](https://avatars.discourse-cdn.com/v4/letter/o/3e96dc/32.png) [@oriori](https://community.shopify.com/u/oriori)\
**Post date:** [January 12, 2022, 8:06am UTC](https://community.shopify.com/t/topic/90672/2 "2022-01-12T08:06:54Z")

</div>

追記いたします。

テーマは「Canopy」を使用しています。

html, css コーディングの知識はございます。

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

---

<div class="post-metadata">

**Author:** ![Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_44fbe07fc59d9ccaacd70575fd5a5155/32/194200_2.png) [@Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://community.shopify.com/u/Anonymous_44fbe07fc59d9ccaacd70575fd5a5155)\
**Post date:** [January 21, 2022, 8:37am UTC](https://community.shopify.com/t/topic/90672/3 "2022-01-21T08:37:31Z")

</div>

恐らくご質問に対する解答としては、「出来ない」ということになります。

理由はShopifyには同ページ内で引数で得たフィルター条件を複数のコレクションに反映する機能は無いからです。

もし弊社で担当するならという解答になりますが、Search機能はAjax用のJsonデータを返す様に設定ができます。任意の形でsearchを2回行い、その結果をJavaScriptで表示する形でしたら対応可能かと存じます。

---

<div class="post-metadata">

**Author:** ![oriori](https://avatars.discourse-cdn.com/v4/letter/o/3e96dc/32.png) [@oriori](https://community.shopify.com/u/oriori)\
**Post date:** [January 21, 2022, 6:14pm UTC](https://community.shopify.com/t/topic/90672/4 "2022-01-21T18:14:52Z")

</div>

フルバランス様

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

同一ページ内に複数コレクションのフィルターを反映する機能はないとのこと。

了解しました。

今回は、同一ページ内に２つのコレクションを掲載することを見送りたいと思います。

明確な答えが見つかり良かったです。

ありがとうございました。
