かんたん商品検索フィルター ご利用方法

商品一覧にサイズ・タイプ・グループ・カテゴリー・在庫・価格帯の絞り込みを追加

1. このアプリについて

「かんたん商品検索フィルター」は、ショップの商品一覧ページ（カテゴリ・グループ・検索結果）に、サイズやタイプなどの絞り込みフィルターを自動で追加するアプリです。商品オプションから絞り込み項目を自動生成するため、難しい設定は不要です。

▲ フィルターのイメージ。選びたい条件をタップすると、条件に合う商品だけが表示されます。

2. アプリでできること

• 商品オプション（サイズ・タイプ等）から絞り込みフィルターを自動生成
• 商品グループ・商品カテゴリー（大カテゴリー単位）・在庫あり・価格帯での絞り込み（スタンダードプラン）
• 絞り込み中の条件をチップで表示。チップの×をタップして個別に解除できます
• 3種のデザインテーマ（ベーシック・モダン・ゴシック）とアクセント色・透過率・文字の濃さでショップに合わせたデザインに変更（スタンダードプラン）
• コンパクトな「絞り込み」バーに折りたたむアコーディオン表示（スタンダードプラン）
• 次ページの商品も自動読み込みして、まとめて絞り込み
• 全テンプレートで動作（テーマ非依存）

3. ご利用の流れ

※ 連携直後は反映まで数分かかる場合があります。商品一覧ページを再読み込みしてご確認ください。

4. プランの違い

ライトプランとスタンダードプランがあります。どちらも5日間の無料お試し期間があります。

※ プランの変更をご希望の場合は、アプリを一度削除してから、ご希望のプランで再インストールしてください（カラーミーショップの仕様）。

5. 設定画面について

設定ページでは以下の操作ができます。カラーミーショップ管理画面の「利用中のアプリ一覧」→「設定」から開けます。

6. 設定項目の説明

フィルターを表示するページ

グループページ・カテゴリページ・検索結果ページのうち、フィルターを表示するページを選べます。ライトプランではカテゴリページのみ利用できます。検索結果ページでは、ショップの全商品のオプション軸が表示されます。

表示方法

フィルターは商品一覧の直上に表示されます。スタンダードプランでは「アコーディオン表示」を選べます。アコーディオン表示をONにすると、初期状態はコンパクトな「絞り込み」バーだけを表示し、クリックでフィルターを開閉します。絞り込み中はバーに条件と件数が表示されます。

「フィルターの見出し」では、フィルター上部に表示されるタイトルを変更できます。アコーディオンON時はバーに、OFF時はパネル上部に表示されます。空欄の場合は「絞り込み」と表示されます。

デザイン（スタンダードプラン）

3種のデザインテーマからショップの雰囲気に合うものを選べます。

• ベーシック — ピル型（丸みのある）チップ。細ボーダーで万能なデザイン
• モダン — シャープでフラットなエディトリアルスタイル
• ゴシック — ボールドで高コントラスト。太ボーダーの構築的なデザイン

アクセント色で選択中のチップやボタンの色を変更できます。背景の透過率を下げると、ショップの背景が透けて見えるようになります。

「文字の濃さ」では、フィルター全体の文字色をグレースケールの濃淡（0=白 〜 100=黒）で調整できます。見出し・軸名・アイコンのほか、チップの文字と枠線、「全解除」「閉じる」などの各ボタンにも同じ色が適用され、フィルター全体の色味が統一されます（選択中のチップはアクセント色のまま）。「テーマ標準」にチェックを入れると、テーマごとの標準の文字色に戻ります。ダーク基調のショップでは薄め（数値小）、ライト基調のショップでは濃いめ（数値大）がおすすめです。

絞り込みの範囲

商品一覧が複数ページに分かれている場合、どこまでの商品を絞り込みの対象にするかを選べます。

• 今見ているページだけ — 表示中のページの商品のみを絞り込みます
• このリストの商品すべて（スタンダードプラン） — 全ページの商品を自動読み込みして、まとめて絞り込みます

すべての商品を絞り込みの対象にしたい場合は、カラーミーショップ管理画面の「1ページに表示する商品数」の設定を増やしてください。1ページに全商品が収まれば、ライトプランでも全商品を絞り込めます。設定場所は、管理画面「デザイン」→「テンプレート編集」を開いたページ下部の「商品一覧の設定」にあります。

絞り込み項目

以下の項目を個別にON/OFFできます。

• オプションで絞り込み — サイズ・カラー等の商品オプションから自動生成されます。軸名（「サイズ」「カラー」など）と選択肢（「S」「M」「L」など）は、ショップに登録されている商品データから自動で取得されます。オプション軸が2つある場合（例: サイズとカラー）はフィルターも2行になります。
  絞り込みの動き: 同じ行（同じ軸）の中で複数選んだ場合は「いずれかに一致する商品」を表示します。異なる行（異なる軸）をまたいで選んだ場合は「すべてに一致する商品」だけを表示します。
  例: サイズで「M」と「L」を選ぶと → MまたはLの商品が表示されます（OR検索）。
  サイズで「M」、カラーで「ブラック」を選ぶと → サイズがMかつカラーがブラックの商品だけが表示されます（AND検索）。
  ※ オプション値の表記揺れにご注意ください。「サイズ」と「size」、「ブラック」と「Black」と「BLACK」など、大文字・小文字・全角・半角が異なると、それぞれ別のオプションとして扱われます。フィルターの選択肢が意図せず分かれてしまう場合は、カラーミーショップ管理画面で各商品のオプション名・値の表記を統一してください
• 「バリエーションなし」ボタン — ONにすると各軸の先頭にボタンが追加され、そのオプションを設定していない商品を絞り込めます
• グループで絞り込み（スタンダード） — 商品グループを設定している場合に表示されます
• カテゴリで絞り込み（スタンダード） — 商品に設定した大カテゴリー単位で絞り込めます（小カテゴリーは対象外）
• 在庫ありのみ表示（スタンダード） — 在庫切れ商品を隠すチェックボックスを表示します。バリエーション単位で在庫を判定します
• 価格帯で絞り込み（スタンダード） — ショップの商品価格の分布から価格帯を自動生成して表示します（セール価格を優先）
• 並び替え（スタンダード） — 価格が安い順・高い順・新着順の並び替えを表示します

グループ・カテゴリ・在庫あり・価格帯の表示名はお好みの文字に変更できます（空欄の場合は標準の表示名を使用）。

7. うまく表示されないとき

• フィルターが表示されない — 設定ページの「再連携」をお試しください。連携し直すことでスクリプトが再設置されます。また、対象ページに商品が2点以上表示されていることをご確認ください。
• 設定変更が反映されない — 設定はサーバー側で最大5分間キャッシュされます。時間をおいてブラウザを再読み込みしてください。
• 商品を追加・変更したのにフィルターに反映されない — 商品データは最大5分間キャッシュされます。時間をおいてご確認ください。
• テンプレートを大きくカスタマイズしている場合 — 商品一覧部分の構成によっては動作しないことがあります。お問い合わせいただければ確認いたします。

8. お問い合わせ・アプリの削除について

お問い合わせ: info@fts-app.com までメールでご連絡ください。

アプリの削除: カラーミーショップ管理画面の「利用中のアプリ一覧」から削除できます。削除すると商品一覧の絞り込みフィルターは表示されなくなります。