Loading...

Knowledge Base

YITH- AJAX Product Filter (WooCommerce)

The YITH WooCommerce AJAX Product Filter plugin sounds like a great tool for online businesses to enhance their customer experience. It is a useful way to help customers easily find the products they are looking for. The plugin works with product categories, tags, and attributes, but it's important to note that these need to be properly set up in WooCommerce before creating filters. This will ensure that the filters work effectively and accurately.


How to create a preset of filters

  1. Log in to your WordPress dashboard.
  2. Navigate to the YITH tab.

    YITH Tab

  3. Click on the Ajax Product Filter.

    YITH Ajax Product Filter tab

  4. Go to the Filter presets tab.

    Filter Presets tab

  5. Click the Add Preset button.

    Add preset button

  6. Create the Preset Name. This is used to identify the filter. For example: Services preset.

    Creating new Preset

  7. Click Save Preset.
  8. Go back to the Filter presets tab.

    Presets Tab

  9. Hover to the Preset Shortcode, then click the edit icon.

    Edit a Preset

  10. Click the Add a new filter button.

    Add a new filter button

  11. Create a Filter name.

    Create  filter name

  12. Choose the Filter Taxonomy.

    Choose Filter Taxonomy

  13. If you select the option to auto-populate the terms within the filter. For example, all the Colors you have created will be automatically displayed in the filter.Enable Auto-populate
  14. If you choose not to enable the automatic populate option, you will need to manually select the attributes to display in the filter. This includes choosing which colors you would like to include, whether it be all of them or just a select few.

    Disable auto populate

  15. If you want to create filter type like "Filter by color" option, using the "color swatches" type would be the best choice. You can also choose from other filter types, such as checkboxes, radio buttons, select, plain text, and labels, depending on your specific needs.

    Create filter type

  16. Click the toggle button if you want to Customize terms.

    Customize terms

  17. You can also set the Terms Hierarchy.

    Terms Hierarchy

  18. Allow multiple selection - Enable multi-select in filter settings to let users select multiple terms for product filtering. This helps the user experience and helps customers find products more easily.

    Allow Multiple Selection

  19. Click Save Preset.

How to insert the filters preset on the Shop page

When creating a preset of filters for your Shop page, you have the option to choose how you want to insert it. This allows you to customize the appearance and functionality of your Shop page to best suit your needs and preferences.

  1. To add a preset to your Shop page with the YITH AJAX Filters Preset block in WordPress.

    Add YITH AJAX Filter preset

    1. Open the Shop page in the block editor.
    2. Add the YITH AJAX Filters Preset block.
    3. Select a preset from the dropdown menu.
    4. Customize the settings
    5.  Preview the page and publish the changes.
  2. To display the filters on a particular page, you can simply insert the preset shortcode on that page. This will enable the filters to appear exactly where you want them to be displayed.

    Preset Shortcode


General Options

To configure the general settings of the YITH Ajax Product Filter, you can access the plugin settings and toggle the options to turn them on or off according to your preferences.

YITH General Option

  1. Filter mode - Choose real-time AJAX filtering or a button to apply all filters. It depends on your use case and user preferences
  2. Show results -You can choose to either load the search results on the same page using AJAX or open them on a new page.
  3. Hide empty terms - enable the hiding of empty terms from the filters section.
  4. Hide out-of-stock products - enable to hide "out-of-stock" products from the results.
  5. Scroll top after filtering - Enable the option to scroll to the top after filtering.
  6. Reset button - enable the "Reset filter" button for the user to cancel the filter in one click.

Customization

The YITH AJAX Filters plugin adopts the typography and link colors of your theme. Additionally, you can customize some colors in the Customization tab to match the look and feel of your website.

Customization Options

  • Titles
  • Background
  • Accent color

Need more options?

Please check YITH's website to purchase or learn more information about the premium version.


Did you find this article helpful?

 
* Your feedback is too short

Loading...