Back to Table of Contents

Working with the Nop Ajax Filters

Please read the following steps for more information on how to configure the Nop Ajax Filters.

Working with the Nop Ajax Filters is as easy as configuring a few settings from the administration of the plugin

  1. Enable Ajax Filters - Sets to Enabled the Ajax Filters widget, thus enabling or disabling the plugin.
  2. Widget Zone - Sets the widget zone in which the Ajax Filters will be displayed.
  3. Filters UI Mode - Sets how the different filter options are presented to the client. They can be either presented via checkbox controls or via dropdown controls. The default setting value is Use Checkboxes.
  4. Scroll To The Top Of The Page After Filtration - Sets whether the page will be autoscrolled to the top after each filtration.
  5. Enable Price Range Filter - Sets whether the Price Range Filter (slider control) is enabled or disabled. The default setting value is true.
  6. Enable Specifications Filter - Sets whether the Specifications Filter is enabled. The Specification Filter contains all the SpecificationAttribute and SpecificationAttributeOptions for the products in the current category. Please note that for the SpecificationAttributeOptions to appear in the filters they need to have their AllowFiltering property set to true. The default setting value is false.
  7. Enable Attributes Filter - Sets whether the Attributes Filter is enabled. The Attributes Filter contains all the Attributes for the products in the current category. The default setting value is true.
  8. Enable Manufacturers Filter - Sets whether the Manufacturers Filter is enabled. The Manufacturers Filters contains all the Manufacturers for the products in the current category. The default setting value is true.
  9. Include Products From Subcategories - Sets whether the products from the immediate subcategories of the current category should be included. This affects both the different filter options as well as the different filter results. This is useful when you have setup your nopCommerce category pages to show products not only from the current category but also from subcategories of the current category. The default setting value is false.

The following settings are System Settings and should be used only if you have done changes to the style or id properties properties of the product list panel (div), product grid (div), pager, sort options dropdown, view options drop down and products page size dropdown html elements in the category template of your nopCommerce installation. The Nop Ajax Filters work via Ajax and in order to achieve this they need to modify these html elements. Therefore the Nop Ajax Filters need to know how to find these html elements in the category page.

  1. Product List Panel Selector - This is the JQuery selector for the product list panel. Nop Ajax Filters show the product filter results in this panel when the View Mode of the category page is set to List. The default setting value is .product-list.
  2. Product Grid Panel Selector - This is the JQuery selector for the product grid panel. Nop Ajax Filters show the product filter results in this panel when the View Mode of the category page is set to Grid. The default setting value is .product-grid.
  3. Pager Panel Selector - This is the JQuery selector for the pager of the category page. Nop Ajax Filters will find the pager and replace its html links with ajax link buttons . The default setting value is .pager.
  4. Sort Options Dropdown Selector - This is the JQuery selector for the sort options dropdown control of the category page. Nop Ajax Filters will find the sort options drop down control and replace it with a JQuery Ajax dorpdown control. The default setting value is #products-orderby.
  5. View Options Dropdown Selector - This is the JQuery selector for the view options dropdown control of the category page. Nop Ajax Filters will find the view options drop down control and replace it with a JQuery Ajax dorpdown control. The default setting value is #products-viewmode.
  6. Product Page Size Dropdown Selector - This is the JQuery selector for the products page size dropdown control of the category page. Nop Ajax Filters will find the products page size drop down control and replace it with a JQuery Ajax dorpdown control. The default setting value is #products-pagesize.