Shopify ストアに商品を絞り込む機能を導入する方法について徹底解説！

はじめに

今回の記事では、Shopify のストア商品を絞り込む機能を実装する方法について解説します。絞り込み機能は顧客の購入体験の向上や関連した商品の閲覧率を高めることに繋がるため、積極的に導入していきましょう。

絞り込みのメリット

Shopify ストアに絞り込み機能を導入することは顧客とストアにとって、以下のようなメリットがあります。

顧客の需要に合わせた商品の提示
商品絞り込み機能を導入することで、顧客は自身のニーズに合った商品を簡単に見つけることができます。特定のカテゴリや属性（価格、色、サイズなど）の絞り込みにより、顧客の需要にマッチした商品提示ができるため、購入に繋がりやすくなります。
関連商品の表示
絞り込み機能を活用すると関連するアイテムが一緒に表示されることが多いため、顧客はそれらをセットで購入する可能性が高まります。これにより、平均注文額が増加し、売上の向上につながります。
顧客の満足度向上
絞り込み機能はサイト全体の使いやすさを大幅に向上させます。検索したい商品を探すことができるため、顧客はストレスなく商品の閲覧を進めることができます。これにより、顧客の満足度を向上させることができます。

Shopify ストアに商品絞り込み機能を導入する

今回の記事では、Shopify ストアに商品絞り込み機能を導入するにあたって、 Shopify の「Shopify Search & Discovery」アプリを使用します。「Shopify Search & Discovery」アプリを使用することで簡単に絞り込み機能が実装できます。

「Shopify Search & Discovery」アプリのインストールページ

「Shopify Search & Discovery」アプリをインストール

「Shopify Search & Discovery」アプリをインストールするには、「オンラインストア」の「メニュー」を開き、「絞り込み」の項目にあるアプリの「インストール」ボタンをクリックします。

「オンラインストア」の「メニュー」を開き、「絞り込み」の項目にあるアプリの「インストール」ボタンをクリック

画面が遷移したら「インストール」をクリックしましょう。

「インストール」をクリック

アプリのインストールが完了したら、次は商品の価格で絞り込む方法について解説します。

商品の価格で絞り込む

価格の絞り込み条件を追加すると、最低価格と最高価格を入力して商品を絞り込むことができるようになります。

商品の価格で絞り込む設定をするために「Shopify Search & Discovery」アプリの設定画面を開きましょう。

「Shopify Search & Discovery」アプリの設定画面を開く

アプリの設定画面を開いたら、「絞り込みをカスタマイズ」を選択します。

「絞り込みをカスタマイズ」を選択

絞り込みの一覧が表示されるので、「絞り込みを追加」をクリックします。

「絞り込みを追加」をクリック

「ソース」の項目の入力欄をクリックすると、絞り込みの項目が表示されるので「価格」を設定します。

「ソース」の項目の入力欄をクリック、「価格」を設定

設定ができたら「保存」をクリックしましょう。

「保存」をクリック

保存が完了すると、ストアに絞り込みの項目が追加されており、「価格」で絞り込めるようになっています。

「価格」で絞り込めるようになっています。

実際に最低価格と最高価格を入力して絞り込むと、条件に一致した商品が表示されます。

最低価格と最高価格を入力して絞り込むと、条件に一致した商品が表示

次は商品のタグで絞り込む方法について解説します。

商品のタグで絞り込む

「絞り込み」ページの画面右上の「絞り込みを追加」をクリックしてタグで絞り込む設定を行っていきます。

「絞り込み」ページの画面右上の「絞り込みを追加」をクリック

「ソース」の項目をクリックし、「タグ」を追加しましょう。

「ソース」の項目をクリックし、「タグ」を追加

「タグ」を追加すると、「値」の項目に商品に設定されているタグ一覧が表示されます。今回の場合、顧客は「イヤリング」「セール」「ネックレス」「ブレスレット」で絞り込むことができます。

「タグ」を追加すると、「値」の項目に商品に設定されているタグ一覧が表示される

「ラベルを絞り込み」の入力欄には顧客に表示したい絞り込みの項目名を付けましょう。設定ができたら「保存」をクリックします。

「ラベルを絞り込み」の入力欄に項目名を入力し「保存」をクリック

設定一覧を見ると、「タグ」の絞り込みが追加されていることが確認できます。

「タグ」の絞り込みが追加されていることが確認できる

実際に、ストアを見てみると「タグ」の絞り込みの追加ができています。これで、「タグ」による絞り込みができるようになりました。

ストアにも「タグ」の絞り込みの追加ができている

次は、商品のオプションで絞り込む方法について解説します。

商品のバリエーションで絞り込む

Shopify の商品の絞り込みは、商品詳細ページの「バリエーション」に設定した項目で絞り込むこともできます。

商品詳細ページの「バリエーション」の項目

バリエーションでは、「サイズ」「色」「素材」「スタイル」などを設定することができます。

「サイズ」「色」「素材」「スタイル」などを設定することができる

今回は全ての商品に対して、「色」を追加したので、色で絞り込む設定をしたいと思います。

商品詳細ページでバリエーションに「色」が追加されているスクリーンショット

「絞り込み」ページの画面右上の「絞り込みを追加」をクリックし、色のバリエーションで絞り込む設定を行っていきます。

「絞り込み」ページの画面右上の「絞り込みを追加」をクリック

「ソース」の項目から「商品オプション」の「色」を選択します。

「ソース」の項目から「商品オプション」の「色」を選択

選択すると、バリエーションに設定した「色」が表示されます。確認ができたら「保存」をクリックしましょう。

確認ができたら「保存」をクリック

設定一覧を見ると、「色」の絞り込みが追加されていることが確認できます。

「色」の絞り込みが追加されていることが確認できる

ストアにも「色」の絞り込みが追加されています。これで、バリエーションで絞り込むことができました。

ストアにも「色」の絞り込みが追加されている

次は、絞り込む値をグループ化する方法について解説します。

絞り込む値をグループ化する

絞り込む値をグループ化すると、類似した商品を 1 つのカテゴリーにまとめることができます。例えば、「ネックレス」「イヤリング」「ブレスレット」を「アクセサリー」としてグループにまとめられます。

絞り込む値をグループ化したい絞り込み条件を開きましょう。今回の解説では「色」を選択します。

「色」を選択

「値」の項目に「ブラック」と「黒」が表示されているので、グループ化して「黒」にまとめたいと思います。

「ブラック」と「黒」をグループ化して「黒」にまとめたい

まとめたい値をチェックし「グループを作成」をクリックしましょう。

まとめたい値をチェックし「グループを作成」をクリック

「名前」の項目にグループ名を入力し、「完了」をクリックしましょう。

グループ名を入力し、「完了」をクリック

これで「黒」と「ブラック」をまとめることができました。

「黒」と「ブラック」をまとめることができた

グループ化を解除したい場合は解除したいグループにチェックを入れ、「値のグループ化を解除」をクリックします。

解除したいグループにチェックを入れ、「値のグループ化を解除」をクリック

これで、グループ化を解除することができました。

グループ化を解除することができた

絞り込み条件を編集する

次に、絞り込み条件の編集について解説します。この Search & Discovery アプリでは、既存の絞り込み条件に対して、絞り込みのラベル名の変更や値のグループの変更をすることができます。
（2024年5月現在、この Search & Discovery アプリでは既存の絞り込み条件の「ソース」の項目を変更することはできません。したがって、既存の条件のソースを変更したい場合は、次の章の「絞り込み条件を削除する」を参考に一度条件を削除し、再度作成する必要があります。）

今回はラベル名の変更について解説していきます。既存の絞り込み条件を編集するには、編集したい条件をアプリの絞り込み一覧の中から選びます。

編集したい条件を選ぶ