サムネイル

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 アプリでは既存の絞り込み条件の「ソース」の項目を変更することはできません。したがって、既存の条件のソースを変更したい場合は、次の章の「絞り込み条件を削除する」を参考に一度条件を削除し、再度作成する必要があります。)

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

編集したい条件を選ぶ

次に、「ラベルを絞り込み」の入力欄をクリックし、任意のラベル名に変更します。
「ラベルを絞り込み」の入力欄をクリック
任意のラベル名に変更

そして「保存」ボタンをクリックして、変更を保存します。

「保存」ボタンをクリック

以上で絞り込みのラベル名を変更することができました。

ラベル名を変更することができた

絞り込み条件を削除する

最後に、絞り込み条件の削除の手順について解説します。
アプリの絞り込み条件一覧の中から、削除したい条件をクリックします。

削除したい条件をクリック

右下の「削除」ボタンをクリックします。

「削除」ボタンをクリック

確認画面が表示されるので、間違いなければ「削除」ボタンをクリックします。

「削除」ボタンをクリック

すると、絞り込み条件一覧の画面に戻り、該当する条件が削除されていることが確認できます。

該当する条件が削除されている

おわりに

今回は、Shopify の絞り込み機能について詳しく解説しました。

適切な絞り込み条件を追加して、お客様のスムーズな購入体験を実現しましょう!

最後まで読んでいただきありがとうございました。

こちらの記事もおすすめです!

おすすめ Shopify アプリ

シンプルブログタグ絞り込み|お手軽タグ一覧挿入のアイコン

シンプルブログタグ絞り込み|お手軽タグ一覧挿入

シンプルなブログ絞り込みアプリ。ストアにタグによるブログ絞り込み機能を簡単に導入できます。

シンプル会員商品割引|お手軽ログイン商品セール設定のアイコン

シンプル会員商品割引|お手軽ログイン商品セール設定

シンプルな日本製の商品割引アプリ。ログインしている顧客を対象とした商品割引を簡単に実現できます。

シンプルボリュームディスカウント|お手軽まとめ買い割引のアイコン

シンプルボリュームディスカウント|お手軽まとめ買い割引

商品毎に、割引テーブルに応じたまとめ買い割引を行えます。

シンプルノベルティ|お手軽ギフト特典のアイコン

シンプルノベルティ|お手軽ギフト特典

シンプルな日本製のノベルティ付与アプリ。条件を満たした注文に対してノベルティ商品を自動で付与します。シンプルな日本製のノベルティ付与アプリ。条件を満たした注文に対してノベルティ商品を自動で付与します。

シンプルおひとり様一点限りの購入制限設定のアイコン

シンプルおひとり様一点限りの購入制限設定

シンプルな日本製のおひとり様一点限りの購入制限アプリ。商品毎に、おひとり様一点限りの購入制限を行えます。

シンプル期間限定セール|お手軽バーゲンセールのアイコン

シンプル期間限定セール|お手軽バーゲンセール

「シンプル期間限定セール|お手軽バーゲンセール」は、ストアの全商品に対して期間限定セールを簡単に実現できるアプリです。

シンプルVIP会員商品割引|お手軽VIP商品セール設定のアイコン

シンプルVIP会員商品割引|お手軽VIP商品セール設定

シンプルな日本製の条件に応じた商品割引アプリ。特別な顧客を対象とした商品割引を簡単に実現できます。

シンプル決済カスタマイズ|お手軽条件ごとの決済方法のアイコン

シンプル決済カスタマイズ|お手軽条件ごとの決済方法

シンプルな日本製の決済カスタマイズアプリ。チェックアウト画面で、特定の条件に基づいて、決済方法の非表示を行えます。

シンプル配送カスタマイズ|お手軽条件ごとの配送方法のアイコン

シンプル配送カスタマイズ|お手軽条件ごとの配送方法

シンプルな日本製の配送カスタマイズアプリ。指定した条件下で特定の配送方法を非表示にできます。

シンプルクラウドファンディング|お手軽自社クラファンのアイコン

シンプルクラウドファンディング|お手軽自社クラファン

シンプルなクラウドファンディングアプリ。商品毎にクラウドファンディングを実現できます。

シンプル会員初回注文割引|お手軽初回ログインセール設定のアイコン

シンプル会員初回注文割引|お手軽初回ログインセール設定

シンプルな日本製の条件に応じた注文割引アプリ。ログインしている顧客を対象とした初回購入時の注文割引を簡単に実現できます。

シンプル顧客タグ注文割引|顧客タグ BtoB 割引のアイコン

シンプル顧客タグ注文割引|顧客タグ BtoB 割引

シンプルな日本製の注文割引アプリ。顧客タグに応じて注文を割引したり、無料にしたりできます。

シンプル会員初回送料割引|お手軽初回ログイン送料無料のアイコン

シンプル会員初回送料割引|お手軽初回ログイン送料無料

シンプルな日本製の条件に応じた送料割引アプリ。ログインしている顧客を対象とした初回購入時の配送料割引を簡単に実現できます。

シンプル会員送料割引|お手軽ログイン送料無料のアイコン

シンプル会員送料割引|お手軽ログイン送料無料

シンプルな日本製の会員配送料割引アプリ。ログイン状態に応じて配送料を割引できます。

シンプル会員注文割引|お手軽ログインセール設定のアイコン

シンプル会員注文割引|お手軽ログインセール設定

シンプルな日本製の注文割引アプリ。顧客のログイン状態に応じて注文を自動割引できる。

シンプルセット商品在庫連携|お手軽セット商品管理の自動化のアイコン

シンプルセット商品在庫連携|お手軽セット商品管理の自動化

シンプルな日本製のセット商品在庫連携アプリ。在庫連携したセット商品販売を簡単に実現できます。

シンプルVIP注文割引|お手軽VIP会員セール設定のアイコン

シンプルVIP注文割引|お手軽VIP会員セール設定

シンプルな日本製の条件に応じた注文割引アプリ。特別な顧客を対象とした注文割引を簡単に実現できます。

シンプル延長保証|お手軽保証付き商品販売のアイコン

シンプル延長保証|お手軽保証付き商品販売

シンプルな保証付与アプリ。商品毎に保証付与ができます。

シンプルVIP送料割引|お手軽VIP会員送料無料のアイコン

シンプルVIP送料割引|お手軽VIP会員送料無料

シンプルな日本製の条件に応じた送料割引アプリ。特別な顧客を対象とした配送料割引を簡単に実現できます。

シンプル追従カート|追従購入ボタン(Buy Button)のアイコン

シンプル追従カート|追従購入ボタン(Buy Button)

シンプルな追従カートアプリ。ストアに追従カートを簡単に導入できます。

シンプル顧客タグ送料割引|お手軽顧客タグ送料無料のアイコン

シンプル顧客タグ送料割引|お手軽顧客タグ送料無料

シンプルな日本製の送料割引アプリ。顧客タグに応じて配送料を割引したり、無料にしたりできます。

シンプルパンくずリスト|お手軽 Breadcrumbsのアイコン

シンプルパンくずリスト|お手軽 Breadcrumbs

カスタマイズ性の高いパンくずをストアに表示できる!

シンプルブログ記事カスタマイズ|お手軽ブログテンプレートのアイコン

シンプルブログ記事カスタマイズ|お手軽ブログテンプレート

シンプルなブログ記事カスタマイズアプリ。ストアにブログ記事カスタマイズ機能を簡単に実現できます。

シンプルお知らせ一覧|お手軽ブログ一覧挿入アプリのアイコン

シンプルお知らせ一覧|お手軽ブログ一覧挿入アプリ

シンプルなお知らせセクションアプリ。ストアにお知らせセクションを簡単に挿入できます。

シンプルブログ記事目次|自動見出し一覧挿入のアイコン

シンプルブログ記事目次|自動見出し一覧挿入

シンプルなブログ目次生成アプリ。ストアにブログ目次を簡単に表示できます。

シンプルスライドショー|お手軽画像スライダーのアイコン

シンプルスライドショー|お手軽画像スライダー

シンプルなスライドショーアプリ。ストアにスライドショーを簡単に表示できます。

シンプル流れるロゴ|流れるロゴリスト挿入アプリのアイコン

シンプル流れるロゴ|流れるロゴリスト挿入アプリ

シンプルな流れるロゴリストアプリ。ストアに流れるロゴリストを簡単に表示できます。

シンプル名入れ|お手軽名前入りギフトオプションのアイコン

シンプル名入れ|お手軽名前入りギフトオプション

シンプルな日本製の名入れオプションアプリ。商品毎に名入れオプションを追加できます。

シンプル在庫数表示|お手軽残りわずか表示のアイコン

シンプル在庫数表示|お手軽残りわずか表示

シンプルな商品の残りわずか表示アプリ。ストアに商品の残りわずか表示を簡単に導入できます。

シンプルギフトラッピング|お手軽ギフト包装アプリのアイコン

シンプルギフトラッピング|お手軽ギフト包装アプリ

シンプルな日本製のギフトラッピングアプリ。カートページに簡単にギフト包装オプションを追加できます。

シンプル購入制限|お手軽注文制限について徹底解説のアイコン

シンプル購入制限|お手軽注文制限について徹底解説

シンプルな日本製の購入数制限アプリ。商品ごとに数量の規制を行えます。

シンプルランキング表示|お手軽ベストセラーのアイコン

シンプルランキング表示|お手軽ベストセラー

購入促進!コレクションにランキングラベルを表示してストアの人気商品をアピール

シンプル顧客タグごとの限定販売|お手軽ロイヤリティのアイコン

シンプル顧客タグごとの限定販売|お手軽ロイヤリティ

日本製の顧客タグごとの購入制限アプリ。特定のタグを持つ顧客への限定販売を簡単に実現できます。

シンプルロゴ一覧|お手軽ロゴリスト表示のアイコン

シンプルロゴ一覧|お手軽ロゴリスト表示

シンプルなロゴリストアプリ。ストアにロゴリストを簡単に導入できます。

シンプル余白調整|お手軽レイアウトのアイコン

シンプル余白調整|お手軽レイアウト

シンプルな日本製の余白調整アプリ。余白を挿入することでページデザインの調整が簡単にできます。

シンプルのし(熨斗)アプリのアイコン

シンプルのし(熨斗)アプリ

シンプルな日本製のしアプリ。のし選択機能を簡単に実現できます。

シンプル画像バナー|お手軽広告バナーアプリのアイコン

シンプル画像バナー|お手軽広告バナーアプリ

シンプルな画像バナーアプリ。ストアに画像バナーを簡単に表示できます。

シンプル Q&A|どこでも FAQのアイコン

シンプル Q&A|どこでも FAQ

シンプルな Q&A アプリ。ストアに FAQ を簡単に導入できます。

シンプルモバイルアプリバナー|スマホアプリに誘導のアイコン

シンプルモバイルアプリバナー|スマホアプリに誘導

シンプルなモバイルアプリバナー。ストアにモバイルアプリバナーを簡単に導入できます。

シンプル流れる告知|流れるお知らせ挿入アプリのアイコン

シンプル流れる告知|流れるお知らせ挿入アプリ

シンプルな流れる告知アプリ。ストアに流れる告知を簡単に導入できます。

シンプル売り切れ非表示|在庫切れ商品の表示変更のアイコン

シンプル売り切れ非表示|在庫切れ商品の表示変更

売り切れ商品を非表示にすることができる日本製アプリ。売り切れになった商品を、自動的に非表示(下書き状態)にすることができます。

シンプルレビュー|お手軽口コミのアイコン

シンプルレビュー|お手軽口コミ

シンプルな日本製のレビューアプリ。レビュー機能を簡単に実現できます。

シンプル会員限定販売|お手軽アカウント必須販売のアイコン

シンプル会員限定販売|お手軽アカウント必須販売

シンプルな日本製の会員限定販売アプリ。商品毎に、ログインしていない顧客の購入制限を行えます。

シンプル会員ランク|お手軽顧客タグ付けのアイコン

シンプル会員ランク|お手軽顧客タグ付け

日本製の会員ランク管理アプリ。条件を達成した顧客に自動でタグを追加し、顧客管理を手助けします。

シンプル Wishlist|お手軽お気に入りのアイコン

シンプル Wishlist|お手軽お気に入り

商品数・お気に入り数の上限なしで使えるお手軽お気に入りアプリ。簡単にお気に入り機能を実現できます。

シンプル Coming Soon|商品ページ発売予告アプリのアイコン

シンプル Coming Soon|商品ページ発売予告アプリ

シンプルな日本製の Coming Soonアプリ。商品毎に発売予告を行えます。

シンプルセット販売|お手軽クロスセルのアイコン

シンプルセット販売|お手軽クロスセル

シンプルな日本製のセット販売アプリ。セット販売でのクロスセルを簡単に実現できます。

シンプル予約販売|受注販売や在庫切れ商品販売で使えるのアイコン

シンプル予約販売|受注販売や在庫切れ商品販売で使える

日本製の予約販売アプリ。予約販売や受注販売、在庫切れ商品販売を簡単に実現できます。

シンプル販売期間設定|商品ごとに期間限定販売のアイコン

シンプル販売期間設定|商品ごとに期間限定販売

シンプルな日本製の期間限定販売アプリ。商品ごとに販売期間を設定することができます。

シンプルVIPプログラム|お手軽VIP会員限定販売のアイコン

シンプルVIPプログラム|お手軽VIP会員限定販売

日本製の VIP 限定販売アプリ。特別な顧客を対象とした限定商品の販売を簡単に実現できます。

シンプルポイント|追加料金なしで使えるお手軽ポイントアプリのアイコン

シンプルポイント|追加料金なしで使えるお手軽ポイントアプリ

シンプルな日本製の定額ポイントアプリ。顧客はポイントをそのまま利用することができます。

おすすめ記事