Add Ajax Filter widgets to your site

You are here:
Estimated reading time: 1 min

To add filter widgets, access Appearance > Widgets and add them in one of the following sidebars:

  • Shop Sidebar . Plain simple sidebar eg: Amsterdam Demo
  • Filter Panel. Filters will be shown in a side panel that opens on clicking the FILTER button on the top right side of the products eg: London Demo .
  • Filter Top Bar . Will show the filters (as dropdowns) before the product listing eg: Melbourne Demo .

All the sidebars above will be shown in the frontend automatically only when they have widgets inside them.

Rey Filters widgets:

  • Filter by Attribute . Displays attributes, styled depending on their attribute type. Read more on Variation Swatches.
  • Filter by Category;
  • Filter by Price;
  • Filter “In Stock” items;
  • Filter “On Sale” products;
  • Filter “Featured” products;
  • Filter by Tags;
  • Filter by custom taxonomy. Used when you use a plugin that uses a custom taxonomy and want to make it available for filters;
  • Active Filters . Displays the active filters that are in use, along with a reset button.

All of the above widgets have the option to either display as a list (and depending on the type, either as colored boxes or buttons) and as dropdowns.

WooCommerce built-in filter widgets:

WooCommerce comes packed with a bunch of widgets that filter too, however they’re reloading the page:

  • Filter Products by Attribute
  • Filter Products by Rating
  • Filter Products by Price
  • Product Categories (not a filter widget but good enough to use)
Was this article helpful?
Dislike 0
Views: 290

Join the conversation