This tutorial is kindly provided by the plugin developer. You can access the full plugin's documentation on this URL: https://wordpress.org/plugins/woocommerce-ajax-filters/?utm_source=free_plugin&utm_medium=plugins&utm_campaign=ajax_filters



Description


WooCommerce AJAX Product Filters – Advanced product filtering ability for your WooCommerce shop. Add unlimited filters with one widget.


NEW FEATURE IN VERSION 1.5

✅ New styles for filters: Checkbox, Select, Slider, Color, Image

✅ New slider styles

✅ New buttons styles

✅ Selected filters area horizontal styles

✅ Single selection for check

✅ Select and Select2 can be displayed on same time

✅ Collapse widget option with different settings

✅ Less JavaScript and HTML code for same result.

✅ More compatibility with themes and plugins

✅ Better compatibility with Divi Builder, Beaver Builder, Elementor Builder

✅ Relevanssi compatibility

✅ More ways to customize filters and add additional functionality

✅ Option to set how hierarchical attribute must be displayed

✅ Separate admin title and frontend title

✅ Back button in browser on AJAX

✅ All JavaScript in one minified file

✅ All CSS Styles in one minified file

✅ Checked style for image element style


FEATURES:

✅ AJAX Filters, Pagination and Sorting!

✅ Filter by Price

✅ Filter by Product Category

✅ Filter by Attribute

✅ Unlimited Filters

✅ Multiple User Interface Elements

✅ Great support for custom/premium themes

✅ SEO Friendly Urls ( with HTML5 PushState )

✅ Filter Visibility By Product Category And Globals.

✅ Accessible through shortcode

✅ Filter box height limit with scroll themes

✅ Working great with custom widget area

✅ Drag and Drop Filter Building

✅ Select2 for dropdown menu

✅ And More…


Installation


STEP 1:

Go to the Admin area -> BeRocket -> Product Filters and check what global options you can manage





STEP 2:

You can add the Filters/Groups with Elementor as follows:









You can edit the selected Group here:



The "Edit" link leads here:



STEP 3: Adding Filters

First, you need to add attributes to the products (the WooCommerce plugin should be installed and activated already )

Go to Admin area -> Products -> Attributes and add attributes your products will have; add them all

Click the attribute’s name where the type is selected and add values to it. Predefine product options.

Go to your products and add attributes to each of them.