WooCommerceアクティビティフィルタブロック解説：選択した条件を表示する便利なコンポーネント

商品フィルタリング機能は、最新のeコマースサイトには欠かせないツールだ。WooCommerce いくつかのフィルターブロックが用意されているが、そのうちのアクティブ・プロダクト・フィルタースクリーニングWare "ブロックは、"Selected Conditions "ユーティリティ機能を表示するために使用される。

この記事では、このブロックが何をするのか、どのように追加するのか、どこに配置するのか、実践的なアドバイスを紹介する。

Active Product Filtersブロックとは何ですか？

このブロックは、カラー、ブランド、価格帯など、ユーザーが現在選択しているフィルターを表示するために使用されます。ユーザーはクリックしてフィルターを削除したり、「すべてクリア」ボタンを使ってフィルターをリセットすることができます。

フィルタリングツールそのものではなく、他のフィルタリングと連携して現在のフィルタリング状況を表示する役割を担っていることを忘れてはならない。

このブロックを追加する方法

操作方法は以下の通り：

とおすワードプレスエディターで、追加したい場所を選択します。
新しいブロックを追加し、"Active Product Filters "を検索して挿入する。

ページにまだ他のフィルターがない場合、このブロックは空白またはプレースホルダーを表示します。

ブロックは、ユーザーがフィルタリングしている場合にのみ、フロントエンドにコンテンツを表示します。

用フィルター

このブロックが正しく動作するためには、ページに少なくとも1つの WooCommerce フィルターブロックを提供：

価格で商品を絞り込む
色やサイズなどの属性で商品を絞り込む

在庫で商品を絞り込む

実際のニーズに合わせてこれらのフィルターを組み合わせ、アクティブな商品フィルターと組み合わせてページ内容を完成させることができます。

スタイルと設定オプション

このブロックの設定項目は多くないが、基本的な機能は十分だ：

表示モードデフォルトはリストですが、タブ（チップ）に切り替えることもできます。

タイトルレベルカスタマイズ可能キャプションH3、H4などの階層は、ページ構造と組み合わせて使われる。

カスケーディングスタイルシートクラス名カスタムクラス名を入力し、インターフェイスをさらに美しくするためのスタイルコードを記述するために使用することができる。

推奨配置

より推奨される方法は、このブロックをショップページのフィルターと並んで配置することです。

例えば、フィルターをページの左側に配置した場合、左側の下に配置することもできるし、フィルターが上部にある場合は、すぐ下に配置する。

このレイアウトは、より明確で、ページ上で視覚的な干渉を引き起こさないだけでなく、ユーザーがいつでも現在のスクリーニングステータスを表示するのに便利です。

使用上の推奨事項

このブロックは他のフィルターと一緒に使用しないと何も表示されません。

ページレイアウトを崩さない範囲で、できるだけフィルターの下に追加する。
ラベルのスタイルはモバイルで読みやすく、小さな画面表示にも適しています。

よくある質問

Q: このブロックは単独で使用できますか？
いいえ。他のフィルターに依存しており、ページにフィルターがない場合、コンテンツは表示されません。

Q: フロントエンドでこのブロックが表示されないのはなぜですか？
ユーザーがまだフィルター条件を選択していないときは表示されません。フィルタリングの動作があると、ブロックが表示されます。

Q：このブロックはどこに設置される予定ですか？
商品一覧ページ（ショップページ）のフィルターと同じエリアに設置すると、併用しやすくなります。

概要

アクティブ商品フィルター」ブロックは、顧客が現在選択されているフィルターを明確に確認し、簡単に削除できる非常に便利なウィジェットです。

価格フィルター、属性フィルター、在庫フィルターなどの他のツールと併用することで、全体的なブラウジングプロセスがよりスムーズになります。

建設中の場合 WooCommerce モールは、フィルタリング機能をより完全で直感的なものにするために、このブロックを使用することを強く推奨する。

スタイルを追加する必要がある場合は、次のように組み合わせることもできる。カスケーディングスタイルシート表示を調整します。あなたがより多くのWooCommerceのチュートリアルを知りたい場合は、光子のゆらぎネットワークをフォローすることを歓迎し、我々は、WordPressのウェブサイト構築に関連する知識を共有し続けます。

お問い合わせ
チュートリアルが読めない？無料でお答えします！個人サイト、中小企業サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨询：1025174874
三 Eメール：info@361sale.com
④ 勤務時間: 月～金、9:30～18:30、祝日休み