SearchWPブログ

WordPressのチュートリアル、ヒント、リソースでビジネスを成長させる

タグでWooCommerceの商品をフィルタリングする方法

WooCommerceストアを運営していると、在庫が増えすぎて訪問者にとって圧倒的になりがちです。

私たちの経験から、顧客は一度に多くの選択肢があると特定の商品を見つけるのに苦労することがわかっています。

買い物客が商品を簡単に絞り込めないと、何も購入せずに離れてしまう可能性があります。

商品タグを追加すると在庫の整理に役立ちますが、顧客が実際にそれらを使用して結果を絞り込む方法が必要です。

この記事では、WPFiltersを使用してWooCommerceの商品をタグでフィルタリングする方法を説明します。

なぜWooCommerceの商品をタグでフィルタリングするのか?

チュートリアルに入る前に、タグの商品フィルタを追加することがあなたのショップにとってゲームチェンジャーとなる理由について話しましょう。

あなたのWooCommerceストアを巨大な衣料品倉庫と考えてください。買い物客が「夏物」や「ヴィンテージ」の商品を特に欲しがっている場合、あなたが所有しているすべての衣料品を一つ一つ探す必要はないはずです。

フィルタがないと、それらをまさにそうするように強制することになり、フラストレーションとカート放棄につながります。

簡単なフィルタを追加することで、ショッピング体験がはるかにスムーズになることを私たちは繰り返し見てきました。訪問者が自分の閲覧体験をコントロールできていると感じるのに役立ちます。

タグをクリックして関連商品のみを表示できる場合、購入を完了する可能性がはるかに高くなります。

さて、WooCommerceの商品タグフィルタを設定する簡単な方法を見てみましょう。

WooCommerceの商品タグフィルタを設定する

WooCommerceで商品をタグでフィルタリングする最良の方法は、WPFiltersを使用することです。

WPFilters - 最高のWordPressフィルタリングプラグイン

WPFiltersは、コンテンツの並べ替えを非常に簡単にするWordPress向けのトップフィルタリングプラグインです。

コードを書く必要なく複雑なフィルタリングタスクを処理してくれるので、私たちはそれを使用するのが大好きです。

通常、WooCommerceのカスタムフィルタを構築するには、開発者を雇うか、テンプレートファイルを編集する必要があります。

WPFiltersはその頭痛の種を取り除き、簡単なビジュアルビルダーを使用してフィルタを作成できるようにします。

SearchWPと同じチームによって構築されているため、データを正確かつ効率的に処理できると信頼できます。

WPFiltersを使用すると、次のことが可能です。

  • 事前構築済み要素:チェックボックス、ラジオボタン、ドロップダウンなどの事前構築済みフィルタから選択します。
  • あらゆるコンテンツをフィルタリング:ブログ記事、商品、ダウンロード、カスタムコンテンツのフィルタを設定します。
  • 高度なデータソースの選択:タグ、カテゴリ、属性、ブランド、配送クラスなどで記事や商品を簡単にフィルタリングします。
  • 共有可能なフィルターURL:フィルター処理された各検索を、訪問者がブックマークして共有できる一意のURLに変換します。
  • Gutenberg統合:WPFiltersブロックを使用して、ページ、投稿、サイドバーにフィルタを追加します。

それでは、サイトでこれをどのように設定できるか見てみましょう。

ステップ 1: WPFilters のインストールと有効化

始めるには、SearchWPのウェブサイトにアクセスし、アカウントにログインする必要があります。

そこにアクセスしたら、プラグインファイルを見つけるために[ダウンロード]タブをクリックします。

WPFiltersプラグインのzipファイルをダウンロード

[WPFiltersのダウンロード]ボタンをクリックして、ZIPファイルをコンピュータに保存してください。

このページにいる間に、ライセンスキーをコピーすることもお勧めします。すぐに必要になります。

次に、WordPressダッシュボードにプラグインをアップロードしてインストールする必要があります。これを行う方法がわからない場合は、WordPressプラグインのインストール方法に関するこのガイドを参照してください。

プラグインをアクティブ化した後、セットアップウィザードが画面に表示されます。「開始する」ボタンをクリックし、簡単な手順に従ってすべてを準備してください。

WPFiltersセットアップウィザード

ステップ2:WooCommerceタグフィルター要素を作成する

次に、訪問者が使用するWooCommerce製品タグフィルター要素を作成する必要があります。

開始するには、WordPressダッシュボードからWPFilters » Elementsにアクセスし、新規追加ボタンをクリックしてください。

WPFiltersで新しい要素を追加

次の画面で、フィルターの名前を一番上に入力します。これにより、後でフィルターを追加することになった場合に整理しやすくなります。

その後、使用したいフィルタータイプを選択してください。

WooCommerceタグフィルターフィールドを選択

このチュートリアルでは、タグにはドロップダウンを使用します。これにより、ユーザーエクスペリエンスをクリーンで整理された状態に保ちながら、顧客がお気に入りのタグを選択できます。

とはいえ、ラジオリストやチェックボックスなど、WooCommerceストア用の任意の事前構築済みフィルターフィールドを選択できます。

選択したら、データソースセクションまでスクロールします。ここで、ドロップダウンメニューをクリックして製品タグを選択するだけです。

WooCommerceタグのデータソースを選択

ステップ3:WooCommerceタグフィルターをカスタマイズする

データソースを選択した後、サイトのスタイルに合わせてフィルターの外観を調整できます。

オプションを表示するには、コンテナセクションまでスクロールしてください。

ここで、「タイトルを表示」オプションを有効にすると、訪問者はそれが何をするものなのかを正確に知ることができます。

フィルターのコンテナ設定を編集する

フィルターを折りたたみ可能にするオプションもあります。

この機能は、特に携帯電話で買い物をしている顧客のために、サイドバーを整理しておくのに非常に役立つと考えています。

次に、アイテムセクションを確認する必要があります。

フィルターのアイテム設定を編集

ここで、アイテム数を表示するオプションを有効にできます。これにより、訪問者はクリックする前に特定のタグで利用可能な製品の数を確認できます。

空のタームを非表示にすることもできます。これにより、顧客がゼロ製品しか見つからないタグをクリックするのを防ぎ、迷惑になる可能性があります。

これらの設定が完了したら、ページの上部にある保存ボタンをクリックしてください。

WooCommerceタグフィルターを保存

ステップ4:ストアにタグフィルターを表示する

フィルターが完全にセットアップされたので、顧客が使用できるようにウェブサイトに追加する必要があります。

WPFiltersは、Gutenbergブロック、ショートコード、またはPHPコードを提供することで、埋め込みプロセスを非常に簡単にします。

注意:覚えておくべき重要なことは、タグフィルターの埋め込み手順は、使用しているWordPressテーマによって異なる場合があるということです。

開始するには、フィルターを表示したいページ(ショップページやサイドバーウィジェットエリアなど)にアクセスしてください。

たとえば、このチュートリアルでは、WooCommerceのショップページにタグフィルターを追加します。プラス記号(+)をクリックして、WPFilters Elementブロックを追加するだけです。

ショップページにWPFilters要素ブロックを追加

ブロックを追加したら、以前に作成したタグフィルターを選択する必要があります。

右側の設定パネルにある「要素を選択」ドロップダウンメニューをクリックしてください。ここから、WooCommerceの商品タグフィルターを選択します。

設定から商品タグフィルターを選択

完了したら、上部にある「保存」ボタンをクリックするだけです。

これで完了です。ライブサイトにアクセスしてフィルターをテストし、商品がどのように並べ替えられるかを確認できます。

たとえば、デモストアで「黒いスニーカー」タグを使用して商品を絞り込みます。

WooCommerceのタグフィルターをテスト

ご覧のとおり、正しい商品がショップページに表示されます。

商品タグフィルターを使用すると、顧客は探している商品を簡単に見つけることができます。その結果、コンバージョンと売上が大幅に増加するでしょう。

この記事が、タグでWooCommerceの商品をフィルタリングする方法を学ぶのに役立ったことを願っています。また、属性でWooCommerceの商品をフィルタリングする方法WordPressでタグ別にブログ投稿をフィルタリングする方法に関するガイドも参照してください。

顧客の商品検索を容易にする準備ができている場合は、ここからWPFiltersを開始できます


著者アバター
アジム・アクター

今日からより良いWordPress検索エクスペリエンスを作成しましょう

役に立たない検索結果で訪問者を失うことはもうありません。SearchWPを使用すると、独自のスマートなWordPress検索をすばやく簡単に作成できます。

今すぐSearchWPを入手
複数の検索エンジンアイコン