絞り込みを追加する
お客様がコレクションページや検索結果に表示される商品を絞り込めるように、Shopify Search & Discoveryアプリを使用してオンラインストア用の絞り込みを作成できます。たとえば、時計を販売するストアの場合、ブランド名、価格、文字盤のサイズ、耐水性に関する絞り込みを作成できます。
要件
絞り込みが利用できるのは、Online Store 2.0のテーマ、およびオンラインストア用の絞り込みLiquid APIかStorefront APIのいずれかを使用するカスタムストアフロントです。Online Store 2.0テーマで絞り込みを表示する方法についてはこちらをご覧ください。
使用しているテーマが絞り込みに対応していない場合でも、Shopify Search & Discoveryアプリ内で絞り込みを作成できます。ただし、お客様に対しては表示されません。
使用しているストアのテーマが絞り込みに対応しているかどうかを確かめるには、管理画面で [コンテンツ] > [メニュー] の順に移動します。使用しているテーマが絞り込みに対応していない場合は、[コレクションと検索の絞り込み] セクションにメッセージが表示されます。
絞り込みを追加する際の考慮事項
Shopify Search & Discoveryアプリを使用する場合は、以下の点を考慮してください。
- 5,000件を超える商品が追加されているコレクションでは、絞り込みは表示されません。このため、大規模なコレクションは、絞り込みが表示可能な小規模のコレクションに分割することを検討してください。たとえば、「女性向け」という単一のファッションコレクションを作成する代わりに、「トップス」、「ジーンズ」、「ブーツ」など、アパレルの種類に基づいた小規模なコレクションを作成します。
- 100,000件を超える検索結果が表示される検索では、絞り込みは表示されません。
- 1つの絞り込みには、ストアで最大100件の絞り込みの値を表示できます。絞り込みの値が100件以上存在する可能性がある場合、一部の値がお客様に表示されないことがあります。類似の値をグループ化することによって、表示する絞り込みの値の数を減らすことができます。絞り込みグループ1つに対して、固有の絞り込み値を最大200件まで設定でき、ストアに対して選択した絞り込みすべての設定で最大1,000件まで絞り込みグループを設定できます。
- Shopify Search & Discoveryアプリでは、絞り込みに最大1,000件の絞り込み値が表示されます。ストア内の固有値をチェックするメタフィールドの数には制限があるため、メタフィールドの絞り込みの表示値は1,000件より少なくなります。絞り込みに表示される絞り込みの値が100件未満の場合、アプリに表示されない絞り込みの値も、ストアでお客様に表示されます。
- [販売元] と [タグ] の絞り込み値には翻訳が提供されません。商品タグの絞り込みは、ストアのデフォルト言語で買い物をしているお客様にのみ表示されます。販売元の絞り込みの値は、常にストアのデフォルト言語に基づいて表示されます。
- 絞り込み値の翻訳は、オンラインストアで公開されている言語に基づいており、国際販売ツールで設定されたマーケット向けの翻訳は表示されません。
- 価格の絞り込みは、ショップのデフォルト通貨以外の通貨には表示されません。
絞り込みのタイプ
すべてのストアでは、同じ標準の絞り込みを表示できます。また、商品カタログ固有のカスタム絞り込みも作成できます。標準の絞り込みとカスタムの絞り込みを組み合わせて、最大で25種類の絞り込みをストアに設定できます。
絞り込みの各ソースは、ストアの絞り込み用に1度のみ使用できます。たとえば、ストアで「価格」の絞り込みを有効にしている場合、「価格」はグレーアウトされ、付加的な絞り込みソースとして選択することはできません。
標準の絞り込み
「出品状況」、「カテゴリー」、「価格」、「商品タイプ」、「タグ」、「販売元」の標準の絞り込みは、すべてのストアで利用できます。
カスタムの絞り込み
カスタムの絞り込みは、ストアで使用されている商品オプション、メタフィールド、メタオブジェクトのいずれかに基づいて行われます。
商品オプションによる絞り込み
商品オプションによる絞り込みは、商品に追加した商品オプションに基づいて行われます。
たとえば、衣料品に「S」、「M」、「L」などの値を取る「サイズ」という商品オプションを追加した場合、対応する「サイズ」という商品オプションに関する絞り込みオプションがSearch & Discoveryアプリで利用できるようになります。
商品メタフィールドによる絞り込み
商品メタフィールドによる絞り込みは、ストア内のすべての商品に割り当てられた商品メタフィールドに基づいています。
カテゴリーメタフィールドによる絞り込み
カテゴリーメタフィールドによる絞り込みは、特定の商品カテゴリーに割り当てられた商品のメタフィールドに基づいています。
バリエーションメタフィールドによる絞り込み
バリエーションメタフィールドによる絞り込みは、ストア内のすべての商品バリエーションに割り当てられた商品バリエーションのメタフィールドに基づいています。
標準の商品属性
Shopifyの標準商品分類に関する標準の商品属性は、商品にカテゴリーを割り当てると、商品メタフィールドの定義として自動的に作成されます。関連するメタフィールドはメタオブジェクト参照です。対応するメタオブジェクト定義は標準であるため変更できません (フィールドの追加、削除、編集はできません)。フィールドの1つには、分類の参照値が記載されています。
Search & Discoveryアプリでは、これらの属性のソースは以下のいずれかとして表示されます。
- 商品メタフィールド：すべての商品に割り当てられた場合。
- カテゴリーメタフィールド：特定の商品カテゴリーに割り当てられた場合。
メタフィールドによる絞り込み
メタフィールドによるすべての絞り込みは、カテゴリーメタフィールド、商品メタフィールド、またはバリエーションメタフィールドのいずれであっても、メタフィールドの定義に基づいています。メタフィールドの定義を追加する方法はこちらをご覧ください。以下に記載されている値タイプのメタフィールドの絞り込みを作成できます。
- 単一行のテキスト
- 単一行のテキスト (リスト)
- 小
- Integer
- trueまたはfalse
- メタオブジェクトリファレンス
- メタオブジェクトリファレンス (リスト)
商品またはバリエーションにメタフィールドを設定した後、絞り込みを編集するときに、メタフィールドの定義を絞り込みとして選択できます。
絞り込みを編集する
- Shopify Search & Discoveryアプリで [絞り込み] に移動し、[絞り込みを追加] をクリックします。
- [ソース] フィールドをクリックし、お客様が利用できるようにする絞り込みソースを選択します。
- 任意：絞り込みの名前を変更します。
- 任意：絞り込みの挙動を変更します。
- 任意：視覚的な表示を変更します。
- 任意：絞り込みの値を複数選択し、1つの値としてグループ化します。
- 任意：絞り込み値を並べ替えます。
- [保存] をクリックします。
[絞り込み] セクションでは絞り込みを並べ替えることもできます。その場合は、個々の絞り込みをドラッグして表示順を設定します。
絞り込み名を変更する
ストア内の既存の絞り込みに設定されているお客様向けの名前は、変更することができます。
絞り込み名を変更しても、絞り込み元に関する情報は変更されません。たとえば、商品オプションを基準にして絞り込み名を変更しても、個々の商品ページに表示される各オプション名は変更されません。
手順
- Shopify Search & Discoveryアプリで [絞り込み] に移動し、名前を変更する絞り込みをクリックします。
- [絞り込みラベル] フィールドに、新しいラベルを入力します。
- [保存] をクリックします。
絞り込み値
ストアには、コレクションや検索結果の商品に該当する絞り込み値のみが表示されます。
絞り込みの値にはさまざまな並び替えルールが適用され、メタフィールドの絞り込みを使用すると、並び替えと表示される値をより詳細に管理できます。
絞り込み値をグループ化する
複数の絞り込み値をグループ化すると、お客様に対してそれを1つの絞り込み値として表示することができます。たとえば、「色」の選択肢として「オニキス」、「エボニー」、「ミッドナイト」がある商品に対しては、これらの値を「黒」という名前の1つの絞り込みにグループ化することができます。1つの絞り込みグループには、最大200個の固有の絞り込み値を追加でき、1件のストアに対しては、最大1,000個の絞り込みグループを設定できます。
ステップ：
- Shopify Search & Discoveryアプリで [絞り込み] に移動し、[絞り込みを追加] をクリックするか、既存の絞り込みの名前をクリックします。
- 絞り込みが標準の商品属性に基づいている場合は、[値を管理] をクリックしてオプションを選択します。標準の商品属性の絞り込みをグループ化することについての詳細は、こちらをご覧ください。
- [値] セクションで、1つの絞り込み値としてグループ化する値を選択します。他の絞り込み値を探すには、検索バーを使用します。
- [グループを作成] をクリックします。
- グループの名前を入力します。これが、お客様に表示される1個の絞り込み値となります。
- [完了] をクリックします。
- [保存] をクリックします。
標準の商品属性の絞り込みをグループ化する
標準の商品属性に基づく絞り込みには、独自のグループ化機能があります。この機能にアクセスするには、[値を管理] をクリックします。ここで、[自動] または [手動] のグループ化を選択できます。
- 自動：値は、分類の基本値に基づいて自動的にグループ化されます。たとえば、「色」の絞り込みに「ライトレッド」、「バーガンディ」、「ルビー」が含まれている場合、それらはすべて「赤」という基本値の下にグループ化されます。グループのラベルと見本はカスタマイズできますが、値の追加や削除はできません。
- 手動：値は初期状態ではグループ化されておらず、上記のステップに基づいてグループ化することができます。
制限事項
カテゴリーの絞り込みでは、グループ化に対応していません。
絞り込みの値の並べ替え
ストアのニーズに最も適した方法で絞り込み値を並べ替えます。以下の2つの並べ替え順序があります。
自動並べ替え
絞り込みの値はデフォルトでアルファベットと数値の昇順で表示されます。たとえば、「靴の寸法」の商品オプションの絞り込みは最小値から最大値の順に表示されます。
数字で始まり単語で終わる絞り込みの値 (「60ワット」など) は、同じ単語で終わる値の絞り込み値の横に表示されます。たとえば、絞り込み値が「2年」、「6か月」、「3年」、「2か月」となっている「時期」の商品オプションの絞り込みは、以下の順序で表示されます。
- 2か月
- 6か月
- 2年
- 3年
並べ替えのカスタム順は、「サイズ」という名前の絞り込みに適用され、一般的なサイズ表現が正しい順で表示されます。たとえば、「XS」 (極小) は「S」 (小) より前に表示されます。
新しい絞り込み値は自動的に並べ替えられます。
手動並べ替え
手動並べ替えでは、絞り込み値の表示順序を選択できます。手動の並べ替え順序を保存すると、並べ替え順序を更新するまで、リストの最後に新しい絞り込み値が表示されます。
ステップ：
- Shopify Search & Discoveryアプリで [絞り込み] に移動し、既存の絞り込みを選択するか、新しい絞り込みを作成します。
- [並べ替え] で、[手動] を選択します。
- 値をドラッグして再配置します。または、複数の値を選択して [上に移動] または [下に移動] をクリックして一緒に位置変更することもできます。
- 任意：[並べ替える] をクリックしてShopify Magicで並べ替えます。
- [保存] をクリックします。
Shopify Magicで並べ替える
Shopify Magicを使用して、絞り込み名とその値に基づいて論理的な順序で値を並べ替えることができます。見本フィルターを使用した絞り込みでは、16進コードと色相環での位置を考慮して、並べ替え順序を決定します。
Shopify Magicを使用して、[並べ替える] ボタンから値を並べ替えることができます。新しい順序が期待にそぐわない場合は、[並べ替えを元に戻す] ボタンをクリックして、手動で並べ替えた順序に戻すか、ストアの要件に合うように値を並べ替えることができます。
空の絞り込み値をカスタマイズする
お客様が購入可能な商品を見つけやすくするために、空の絞り込み値をリストの底部にまとめることや、完全に非表示にすることができます。これにより、お客様は条件と一致する結果の値に注目できます。たとえば、色とサイズが異なるTシャツを販売していて、「赤」以外のすべての色が在庫切れになっているとします。空の値を下部にまとめると、「色」の絞り込みで「赤」が最初に表示されます。また、空の値を非表示にすると、「色」の絞り込みでは「赤」の選択肢のみが表示されます。
手順
Shopify Search & Discoveryアプリで [設定] に移動します。
[絞り込み] > [空の値] セクションで、以下のいずれかのオプションを選択します。
- 空の絞り込み値を非表示にするには、[非表示にする] を選択します。すべての絞り込み値が空の場合、絞り込みは完全に非表示になります。
- 空の絞り込み値を値リストの下部に移動するには、[最後に表示] を選択します。
- デフォルトの並べ替えロジックで並べ替えた空の絞り込み値を保持するには、[デフォルトの順序で表示] を選択します。
[保存] をクリックします。
絞り込みの値を除外する
お客様に表示する値を詳細に管理する必要がある場合は、ストアに表示する値のみを含むメタフィールドの絞り込みを使用できます。
たとえば、スマートコレクションの条件や管理画面の商品リストの絞り込みなど、ストアフロントの絞り込み以外の目的で商品タグを使用する場合が考えられます。この場合は、商品タグの絞り込みタイプの代わりに、1行のテキストまたはリストタイプのメタフィールドタイプを使用できます。
視覚的な絞り込み
絞り込み値には、色やパターン、詳細な画像などの視覚的要素を含めることができます。たとえば、「布地の色」の絞り込みでは、絞り込み値ごとに小さな色見本を表示できます。
絞り込み値を使用してビジュアルを作成するには、メタオブジェクト参照に基づいて以下の絞り込みタイプを使用します。
標準の商品属性の絞り込みを追加する
ステップ：
- ShopifyのSearch & Discoveryアプリで、[絞り込み] に移動します。
- [絞り込みを追加] または既存の絞り込みをクリックします。
- [ソース] フィールドをクリックし、標準の商品属性に基づいて、カテゴリーメタフィールドまたは商品メタフィールドのタイプの絞り込みを選択します。
- [値を管理] をクリックします。
- グループ化を [自動] または [手動] のどちらかで行うかを選択します。
- **[見本を含める]**を選択します。テキストのみの場合はこのオプションを選択しないままにすることができます。
- 画像を見本として使用するには、[利用可能な場合は画像を使用する] を選択します。
カスタムメタフィールドによる絞り込みを追加する
メタオブジェクト参照に基づくカスタムメタフィールドによる絞り込みを追加できます。カスタムメタフィールドによる絞り込みを追加する前に、以下の要件とベストプラクティスを確認してください。
カスタムメタフィールドに基づく視覚的な絞り込みの要件
カスタムメタフィールドによる絞り込みのビジュアルを作成するには、以下の要件を満たす必要があります。
以下の基準を満たすメタオブジェクト。 - 画像が付いた1つ以上の色フィールドまたはファイルフィールド。どちらのフィールドも1つの値にのみ対応でき、値のリストには対応していません。 - 絞り込み値に名前を付けるフィールド。1つの値のみを許可する必要があり、値のリストを絞り込み名として使用することはできません。このフィールドは、以下のいずれかのタイプにすることができます。 - 単一行のテキスト - 小数 - 整数 - boolean (trueまたはfalse)
以下の基準を満たすメタフィールド定義。 - 定義は商品またはバリエーションに対して行われます。 - メタフィールドタイプはメタオブジェクトであり、前のステップで作成したメタオブジェクト定義を参照します。 - メタフィールドで、1つのエントリーまたはメタオブジェクトのエントリーのリストを許可するかどうかを設定します。
メタオブジェクト定義とメタフィールド定義の両方で、ストアフロントアクセスを有効にする必要があります。
カスタムメタフィールドに基づく視覚的な絞り込みのベストプラクティス
商品バリエーションを絞り込むことにより、検索結果とコレクションページ上のより関連性が高いバリエーションへのリンクが可能になります。たとえば、赤色の見本をクリックすると、赤色の商品のみが表示されます。バリエーションレベルの絞り込みを活用するには、メタオブジェクトリファレンスにバリエーションのメタフィールドを使用します。絞り込みにとって特定のバリエーションへのリンクが重要ではない場合は、代わりに商品のメタフィールドを使用してください。
色見本のメタオブジェクト定義には、色フィールドと画像フィールドの両方が必要です。両方の値を指定する必要はありませんが、これにより、将来いずれかのフィールドを使用できるようになります。
商品やバリエーションに絞り込みが可能な複数の色がある場合、メタフィールドの定義を設定してエントリーのリストを許可します。これにより、複数のメタオブジェクトエントリーを1つのアイテムに割り当てることができ、各メタオブジェクトエントリーがストアに絞り込み値として表示されます。
ステップ：
- ShopifyのSearch & Discoveryアプリで、[絞り込み] に移動します。
- [絞り込みを追加] または既存の絞り込みをクリックします。
- [ソース] フィールドをクリックし、絞り込みのタイプとして「カタログ」、「商品」または「バリエーション」のメタフィールドを選択します。
- メタフィールドを選択して、絞り込み値のラベルフィールドを設定します。
- [イメージを追加する] にチェックを入れ、ビジュアルスタイルを選択します。
小さな色見本やパターンには、[見本] を選択します。以下を選択して、見本の内容を設定してください。
- 見本の色の色フィールド。
- 見本パターンの画像フィールド。
アイコンやロゴなど、トリミングしないグラフィックについては、[画像] を選択します。[画像] の画像フィールドを選択して、内容を設定してください。
絞り込みの仕組み
コレクションページ上の商品または検索結果上の商品に適用できる絞り込みのみ表示されます。
「および」条件を使用すると、複数の絞り込みから絞り込み値を選択でき、これによって表示される商品の数を減らすことができます。たとえば、「色」の絞り込みで「赤」、「サイズ」の絞り込みで「8」を選択すると、サイズ8の赤い商品が返されます。
デフォルトでは、「または」条件を使用すると、同じ絞り込みから絞り込み値を選択でき、これによって結果の件数が増える場合があります。たとえば、「色」の絞り込み値として「赤」と「緑」を選択すると、赤または緑の商品がすべて返されます。特定の絞り込みのタイプでは、代わりに「および」条件を絞り込み値に対して使用できます。Shopify Search & Discoveryアプリを使用すると、絞り込みの挙動のカスタマイズ方法を確認できます。
表示される商品の数は、絞り込みが商品レベルであるか、バリエーションレベルであるかによって異なります。たとえば、お客様が商品オプションの絞り込みから複数の色の値を選択しても、1つの商品しか表示されないことがあります。これは、商品オプションがバリエーションレベルの絞り込みであり、すべての色がその1つの商品のバリエーションに属している場合に生じます。
絞り込みの挙動をカスタマイズする
商品タグ、メタフィールドリスト、メタオブジェクトリファレンスリストの絞り込みでは、絞り込み値の条件として、デフォルトの「または」条件もしくは「および」条件を選択できます。たとえば、「および」絞り込みを使用して、商品タグの絞り込みで「新しい」と「セール」を選択すると、この両方のタグが付いている商品のみが返されます。
手順
- Shopify Search & Discoveryアプリで [絞り込み] に移動してから [絞り込みを追加] をクリックします。
- [ソース] フィールドをクリックし、お客様が利用できるようにする絞り込みソースを選択します。
- [ロジック] セクション内の絞り込み値に適用する挙動を選択します。
- [保存] をクリックします。
翻訳を絞り込む
絞り込みのラベル、値、グループは、ストアが対応している他の言語に翻訳することができます。この翻訳には、Shopify Translate & Adaptなどの翻訳アプリを使用します。
絞り込み用に翻訳された内容がない場合は、ストアのデフォルトの言語が使用されます。
絞り込み値は、商品と商品バリエーションの翻訳内容を基準としています。
絞り込み値の数は、言語によって異なる場合もあります。たとえば、ストアのデフォルト言語が英語で、対応言語としてフランス語も追加されており、「色」の絞り込み値に「Brown (茶色)」という値があるとします。英語には茶色を意味する標準語が1つ、フランス語には標準語が2つあります。翻訳アプリを使用すると、ストアにある商品の「Brown (茶色)」という絞り込み値が、自動的に「Brun (茶色)」や「Marron (茶色)」に翻訳されます。ストアフロントの絞り込みでは、英語の場合は「色」の絞り込みで茶色に対して1つの値が表示され、フランス語の場合は2つの値が表示されます。
各絞り込み値に対する翻訳を1つのみにするには、翻訳アプリで商品の翻訳内容を編集する必要があります。
マーケットの言語
絞り込み値の翻訳は、特定マーケットの言語設定の追加インスタンスには対応していません。たとえば、オンラインストアでのフランス語の商品翻訳については、カナダとフランスのマーケット向けに、2件のフランス語翻訳を追加できます。この場合は、お客様が特定マーケットでフランス語で買い物している場合でも、すべての絞り込み値は一般的なフランス語が基準となります。
絞り込みラベルと絞り込みグループは、特定マーケット向けの言語翻訳に対応しています。