それらは何ですか？それらの使用方法

オンラインストアの運営は難しい場合があります。 顧客が探している商品を見つけられるように、商品を整理する必要があります。 幸い、 WooCommerce製品フィルターブロックは、ユーザー指定のアイテムを数秒でグループ化して表示できます。

製品フィルターブロックを使用すると、WooCommerceショップのアイテムをその特性に応じて整理できます。 これらには、価格、カテゴリ、属性、またはタグが含まれる場合があります。 次に、ブロックを投稿またはページに挿入するだけで、顧客はフィルタリングされた結果を見つけることができます。

このガイドでは、さまざまなWooCommerce製品フィルターブロックをすべて紹介し、それらの使用を検討する理由について説明します。 次に、これらの要素をオンラインストアに挿入して構成する方法について説明します。 始めましょう！

目次：

WooCommerce製品フィルターブロックの紹介

WooCommerceには、ユーザーがオンラインストアで特定の製品を検索できるように設計されたWooCommerceブロックのコレクションがあります。 これらのインタラクティブな要素により、消費者は結果をフィルタリングし、ニーズに最も適したアイテムを見つけることができます。

無料のWooCommerce製品フィルターブロックの概要は次のとおりです。

• 価格で製品をフィルタリング：このブロックを使用すると、顧客はスライダーを使用して価格範囲を選択し、その範囲内に収まるアイテムのみを表示できます。
• 属性で製品をフィルタリング：サイズ、色、スタイルなどの属性に従ってアイテムを検索できます。
• アクティブな商品フィルター：顧客が検索に既に適用したフィルターを確認して、調整できるようにします。
• 在庫による製品のフィルタリング：このブロックには、在庫のあるアイテム、在庫のないアイテム、または入荷待ちのアイテムのみが表示されます。

これらのブロックは、投稿、ページ、ウィジェット領域で使用できます。 ブロックを操作するとき、顧客は事前に定義されたパラメーターから選択して、フィルター処理された結果を確認できます。

製品フィルターをより柔軟に設定したい場合は、専用のWooCommerce製品フィルタープラグインをインストールすることもできます。 この記事の後半で、いくつかの品質オプションを共有します。

WooCommerce製品フィルターブロックの使用を検討する理由

WooCommerce製品フィルターブロックは、オンラインストアのユーザーエクスペリエンス（UX）を大幅に向上させることができます。 製品の広範なカタログがある場合、顧客は自分のニーズに合ったものを探している間、アイテムをスクロールするのに何時間も費やす可能性があります。 しかし、彼らはおそらく欲求不満を感じ、どこか別の場所で買い物をするためにクリックします。

販売する商品に応じて、商品フィルターを使用すると、顧客は店舗を閲覧して、ニーズに合った色、サイズ、材料、ブランドを探すことができます。 さらに、結果は同じページで更新されます。 したがって、消費者はカテゴリページに移動してショッピング体験を中断する必要はありません。

WooCommerce製品フィルターブロックの使用方法

この最初のセクションでは、WooCommerceに自動的に含まれるデフォルトの製品フィルターブロックを使用する方法を示します。 繰り返しになりますが、柔軟性を高めるために、次のセクションでWooCommerce製品フィルタープラグインの1つを検討できます。

ほとんどのWooCommerce製品フィルターブロックは同じように機能します。 ブロックを挿入して、表示される製品特性を決定するだけです。

+ボタンをクリックして新しいブロックを挿入し、「WooCommerce filter：」を検索すると、WordPressでこれらすべてのブロックを見つけることができます。

まず、WooCommerce製品に属性、タグ、カテゴリ、およびその他の特性を追加する必要があることに注意してください。 そうしないと、ブロックで使用するデータがありません。

それでは、WooCommerce製品フィルターブロックの使用方法を見てみましょう。 例として、[属性による製品のフィルター]要素を使用します。

ステップ1：WooCommerce製品に属性を追加する

️注–他のフィルター（価格や在庫など）の場合、属性を設定する必要はありません。

まだ行っていない場合は、WooCommerce製品にカテゴリ、タグ、および属性を追加することをお勧めします。 これらの分類法により、顧客は目的のアイテムを簡単に見つけることができます。 さらに、WooCommerce製品フィルターブロックはこれらの分類なしでは機能しません。

まず、WordPressダッシュボードの[製品]>[属性]に移動します。 ここで、製品の新しい分類を作成できます。 ご覧のとおり、オンラインストアにはすでに色とサイズがあります。

新しい属性の名前とスラッグを入力する必要があります。 次に、[属性の追加]をクリックして分類を保存します。 製品カテゴリ（およびサブカテゴリ）とタグについても同じプロセスに従うことができることに注意してください。

次に、製品を開いて分類法を追加します。 これを行うには、[製品] > [すべての製品]に移動し、アイテムをクリックします。

次に、[製品データ]セクションまで下にスクロールして、[属性]メニューを開きます。

ドロップダウンメニューから属性を選択して[追加]をクリックすると、製品に属性を追加できます。 次に、属性の横にあるドロップダウン矢印を選択して、カスタム情報を入力します。

たとえば、この例では、製品に色属性として赤を追加しました。

すべての変数を追加したら、[属性の保存]をクリックします。 これで、顧客はWooCommerce製品フィルターブロックを介してこれらの特性を持つアイテムを見つけることができるようになります。

ステップ2：製品フィルターブロックを挿入します

次に、商品フィルタブロックを使用するページまたは投稿を開く必要があります。 また、顧客が閲覧中に結果をフィルタリングできるように、ショップページのサイドバーにある要素を利用することを検討することもできます。

まず、 AllProductsブロックをページに追加する必要があります。 そうしないと、WooCommerceは特定のアイテムをフィルタリングして表示できなくなります。

これを行うには、[ + ]ボタンをクリックして、「すべての製品」を検索します。 ブロックを選択してページに追加します。

次に、「WooCommerceフィルター属性」を検索します。

ブロックをクリックすると、ページに挿入されます。 これで、商品属性を検索するか、ドロップダウンリストから商品属性を選択できます。 この例では、 Colorを使用します。

これで、ブロックが変換されて、新しいタイトルと、選択した製品属性（さまざまなアイテムの色など）のリストが表示されます。

見た目が気に入ったら、ブロックをそのままにしておくことができます。 または、次のステップで、この要素の外観をカスタマイズする方法について説明します。

ステップ3：ブロック設定を構成する

次に、WooCommerce製品フィルターブロックの外観をカスタマイズできます。 [属性で製品をフィルター]ブロックをクリックして、右側の歯車アイコンを選択するだけです。

ここで、製品数を表示するかどうかを選択できます。 この設定は、アイテムのカタログが多く、顧客に幅広い選択肢を提供したい場合に便利です。

製品属性の見出しレベルを選択することもできます。 デフォルト値はH3ですが、ストアのスタイルのニーズに合わせてH2からH6まで選択できます。

下にスクロールすると、 [ブロック設定]の下にいくつかの追加の構成が表示されます。

ここで、クエリタイプを選択できます。 Andを選択した場合、WooCommerceは顧客が指定したすべての属性を含む製品のみを表示します。 一方、[ Or ]オプションは、少なくとも1つの属性を持つすべてのアイテムを表示します。

[表示タイプ]で、属性をリストまたはドロップダウン形式で表示するように選択できます。 どちらのオプションも比較的ユーザーフレンドリーです。

最後に、 [フィルター]ボタンを有効にすることを選択できます。 オンにすると、顧客は[移動]をクリックして検索結果をフィルタリングする必要があります。 ただし、オフのままにすると、属性の1つを選択するだけで、表示されている製品が更新されます。

それでおしまい！ これで、WooCommerce製品フィルターブロックを実行する準備が整いました。

変更を保存して公開するだけです。 これで、顧客は特定の属性を使用して商品検索をフィルタリングできるようになります。

WooCommerce製品フィルタープラグインの概要

無料のWooCommerceブロックとは別に、サードパーティのプラグインにアクセスして、フィルターをより柔軟に設定することもできます。 たとえば、WooCommerce Product Searchプラグインには、次のフィルターオプションが含まれています。

• 製品：フィルタリングされた製品のコレクションを表示します。 このブロックは、ショップページを複製し、同じページ上の他の製品フィルターブロックによって制御されるアイテムをレンダリングできます。
• 検索： WooCommerceストアのフィルターされた検索機能を作成します。
• カテゴリ：衣類の種類や性別など、特定のカテゴリに対応する商品を表示します。
• 属性：色、ブランド、サイズ、形状、メーカー、特定の機能など、特定の属性を持つ製品を表示します。
• タグ： 「注目」、「ロゴ」、「トレンド」など、商品タグに対応する商品を表示します。
• 価格：指定された価格パラメータ内の製品を表示します。
• 評価：平均評価に従って製品を提示します。
• 販売：販売中の製品のみを表示します。
• 在庫：在庫のある商品のみを表示します。
• リセット：顧客が製品フィルターパラメーターをリセットできるようにします。 次に、利用可能なすべてのアイテムを表示したり、新しい設定を入力して検索をカスタマイズしたりできます。

または、WooCommerceプラグイン用のWOOF製品フィルターの使用を検討することもできます。

このプラグインを使用すると、顧客はカテゴリ、属性、タグ、カスタム分類、および価格に従ってアイテムをフィルタリングできます。 さらに、表示される結果は通常、デフォルトのWooCommerceブロックよりも魅力的でカスタマイズ可能です。

WooBeWooによるWooCommerceProductFilterは、もう1つの優れたフリーミアムオプションです。

単独で使用することも、Elementorと組み合わせて使用​​して、独自の製品フィルターとレイアウト条件を設計することもできます。 プレミアムプラグインには、カテゴリアイコン、カスタムスタイル、フィルターの非表示/表示ボタンなどの追加機能が含まれています。

WooCommerce製品フィルターを今すぐ始めましょう

幸い、WooCommerce製品のフィルターブロックを使用するのも非常に簡単です。 カテゴリ、属性、タグなどの分類法を商品に追加するだけです。 次に、ショップページのAllProductsブロックと一緒に対応するWooCommerceブロックを使用できます。

柔軟性を高めるために、専用のWooCommerce製品フィルタープラグインをインストールすることもできます。

より良いWooCommerceストアを作成するためのさらに多くの方法を見つけたい場合は、必須のWooCommerceプラグインのコレクションを確認することもできます。

WooCommerce製品フィルターブロックの使用について質問がありますか？ 以下のコメントセクションでお知らせください。