---
title: Configuring product listings with filtering
related:
- https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website.md
- https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes.md
- https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/using-search-filters.md
- https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes/defining-general-indexes.md
- https://docs.kentico.com/k10/developing-websites/managing-page-templates.md
---
> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).
When you want to display [products](https://docs.kentico.com/k10/e-commerce-features/managing-your-store/products.md) on your [site](https://docs.kentico.com/k10/configuring-kentico/managing-sites.md), you may want to provide filters to your [customers](https://docs.kentico.com/k10/e-commerce-features/managing-your-store/customers.md), in which they can filter your products, i.e. so-called **faceted search**. For example, you may want to let your customers to filter them according to their name, stock availability, etc. You may also want your customers to be able to sort the products by their price.
In Kentico, you can create a product filter with the [smart search](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website.md) functionality and its [indexes](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes.md) and [filters](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/using-search-filters.md). With product filtering, you can create any type of filter.
To set up a product filter:
- Decide whether you want to:
- Filter products based on a text property – typically, you use text filtering when you want to provide filtering by name. For this type of filtering, you use a text box.
- Filter products based on an option property – suitable, for example, when you want to filter the stock availability, a manufacturer or a product parameter. For this type of filtering, you can use checkboxes, drop-down lists, etc.
- [Prepare the index](#preparing-the-index)
- [Display the filter](#placing-the-filter-web-part)
- [Display the filter results](#displaying-the-filter-results)
## Preparing the index
Prepare the index for the filter to be able to search in the specific database columns. If the field is a general page or SKU field (e.g., page name, description, manufacturer), you need to [set the fields in thePageclass of thePagesmodule](#preparing-the-index-for-a-general-page-or-sku-field). On the other hand, if the field is a page type specific (e.g., the origin country of a coffee you sell that has its database column located in the **Coffee** page type), you need to [set the fields in the specific page type](#preparing-the-index-for-a-page-type-specific-field). After preparing the index, do not forget to [rebuild the index](#rebulding-the-index).
### Preparing the index for a general page or SKU field
1. Open the **Modules** application.
2. **Edit** () the **Pages** module.
3. Switch to the **Classes** tab.
4. **Edit** () the **Page** class.
5. Switch to the **Search** tab.
6. Click **Customize** and confirm the dialog.
7. On the row with the desired field name, select the required columns.
- Field names are corresponding with database columns. The desired field name is the database column name in which the filter will search (for example _DocumentName_).
- If you want to filter products based on a text, select [Content,SearchableandTokenized](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes/defining-general-indexes.md). If you want to filter products based on an option, select _Searchable_ and _Tokenized_.
> **Tip:** _Tokenized_ is important when the values of the database column have spaces in them. If you know that no value has or will have a space inside, you can leave the _Tokenized_ cleared.
8. Click **Save**.
The index now indexes and searches in the modified field name (database column) as described in [Defining general indexes](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes/defining-general-indexes.md).
### Preparing the index for a page type specific field
1. Open the **Page types** application.
2. **Edit** () the specific page type.
3. Switch to the **Search fields** tab.
4. On the row with the desired field name, select the required columns.
- Field names are corresponding with database columns. The desired field name is the database column name in which the filter will search (for example _DocumentName_).
- If you want to filter products based on a text, select [Content,SearchableandTokenized](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes/defining-general-indexes.md). If you want to filter products based on an option, select _Searchable_ and _Tokenized_.
> **Tip:** _Tokenized_ is important when the values of the database column have spaces in them. If you know that no value has or will have a space inside, you can leave the _Tokenized_ cleared.
5. Click **Save**.
The index now indexes and searches in the modified field name (database column) as described in [Defining general indexes](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/creating-search-indexes/defining-general-indexes.md).
### Rebulding the index
You need to refresh the index to include the just changed fields.
1. Open the **Smart search** application.
2. On the **Indexes** tab, edit the index you just modified.
3. Click **Rebuild**.
The index is now rebuilt and contains all the needed data.
## Placing the filter web part
To place the filter on a page, place the **Smart search filter** web part on the page and enter its properties:
1. Open the **Pages** application and navigate to the [main page of products](https://docs.kentico.com/k10/e-commerce-features/configuring-your-store/configuring-products/configuring-product-structure.md).
- If you have not created any product structure yet, [create a new page](https://docs.kentico.com/k10/managing-website-content/working-with-pages/creating-new-pages.md) of the **Page (menu item)** page type in the **Pages** application.
2. On the **Properties -> Template** tab, if the template is not ad-hoc (the name is not in the form: "Ad-hoc: _name of the page_"), click **Clone template as ad-hoc** to create a template based on the template of the parent page.
3. (Optional) If you want to modify the template of the page, click **Edit template properties** and in the **Edit page template** dialog, switch to the **Layout** tab.
- See [Managing page templates](https://docs.kentico.com/k10/developing-websites/managing-page-templates.md) to learn more information about modifying page templates.
4. To display the field of the filter, place the **Smart search filter** web part on the **Design** tab.
5. Edit the properties of the **Smart search filter** according to your needs:
- If you want to filter products based on a text, enter the following properties:
| Field | Value |
| -------------------- | ----------------------------------------------------------------------------------------------------------------------- |
| Filter mode | _Text box_ |
| Values | Type the desired field name is the database column name in which the filter will search.
For example: _DocumentName_ |
| Filter clause | _Must_ |
| Field is conditional | _Yes (selected)_ |
- If you want to filter products based on an option, enter the following properties:
| Field | Value |
| -------------------- | ----------------------------------------------------------------------------------------------------------------------- |
| Filter mode | Specify how the filter look like.
For example: _Dropdown list_ |
| Filter auto postback | Specify whether the filter automatically reloads results when changed. |
| Values | Type the desired field name is the database column name in which the filter will search.
For example: _DocumentName_ |
| Field is conditional | _No (cleared)_ |
**Specific examples**
Public status filter
To create a filter displaying products according to products' public statuses, set also the following properties:
| Field | Value |
| --------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Query name | Create a new query:
**Query name**: set a query name, for example _SelectPublicStatusesFilter_
**Query type**: _Query text_
**Requires transaction**: _No (cleared)_
**Query text**:
`SELECT '', '', '(all)'
UNION
SELECT 'SKUPublicStatusID', '(int)' + CONVERT(varchar(10), PublicStatusID), PublicStatusDisplayName
FROM COM_PublicStatus
WHERE (##WHERE##)
AND PublicStatusEnabled = 1
ORDER BY (##ORDERBY##)
` |
| Query WHERE condition | `PublicStatusSiteID = {% CurrentSiteID %}
` |
| Filter status | _Must_ |
| Filter is conditional | _Yes (selected)_ |
Manufacturer filter
To create a filter displaying products according to products' manufacturers, set also the following properties:
| Field | Value |
| --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Query name | Create a new query:
**Query name**: set a query name, for example _ManufacturerFilterQuery_
**Query type**: _Query text_
**Requires transaction**: _No (cleared)_
**Query text**:
`SELECT '', '', '(all)'
UNION
SELECT 'SKUManufacturerID', '(int)' + CONVERT(varchar(10), ManufacturerID), ManufacturerDisplayName
FROM COM_Manufacturer
WHERE (##WHERE##)
AND ManufacturerEnabled = 1
ORDER BY (##ORDERBY##)
` |
| Query WHERE condition | `ManufacturerSiteID = {% CurrentSiteID %}
` |
| Filter clause | _Must_ |
| Filter is conditional | _Yes (selected)_ |
Sort filter
To create a filter displaying products sorted according to products' prices, set also the following properties:
| Field | Value |
| --------------------- | ---------------------------------------------------------------- |
| Values | _SKUPrice DESC;;Price descending_
_SKUPrice;;Price ascending_ |
| Filter clause | _None_ |
| Filter is conditional | _No (cleared)_ |
Stock filter
To create a filter displaying products according to products' availability in stock, set also the following properties:
| Field | Value |
| --------------------- | -------------------------------------------------- |
| Values | _-SKUAvailableItems;\[\* TO (int)0];Only in stock_ |
| Filter clause | _None_ |
| Filter is conditional | _Yes (selected)_ |
> **Tip:** You can also create a filter displaying products according to a specific product parameter (a [product page type](https://docs.kentico.com/k10/e-commerce-features/configuring-your-store/configuring-product-page-types.md) field). See [the sampleDancing Goatsite](https://docs.kentico.com/k10/e-commerce-features/configuring-your-store/installing-the-e-commerce-sample-sites.md) for other examples of filtering based on a product parameter.
6. **Save & Close** the web part properties dialog.
The system places the web part on the page and customers can filter your products (however, the results are not displayed anywhere yet).
## Displaying the filter results
1. Open the **Pages** application and navigate to the [main page of products](https://docs.kentico.com/k10/e-commerce-features/configuring-your-store/configuring-products/configuring-product-structure.md).
- If you have not created any product structure yet, [create a new page](https://docs.kentico.com/k10/managing-website-content/working-with-pages/creating-new-pages.md) of the **Page (menu item)** page type in the **Pages** application.
2. On the **Properties -> Template** tab, if the template is not ad-hoc (the name is not in the form: "Ad-hoc: _name of the page_"), click **Clone template as ad-hoc** to create a template based on the template of the parent page.
3. (Optional) If you want to modify the template of the page, click **Edit template properties** and in the **Edit page template** dialog, switch to the **Layout** tab.
- See [Managing page templates](https://docs.kentico.com/k10/developing-websites/managing-page-templates.md) to learn more information about modifying page templates.
4. To display product data, place the **Smart search results** web part on the **Design** tab.
5. Edit the properties of the **Smart search results** according to your needs:
| Field | Value |
| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Web part control ID | Name the web part.
For example: _SmartSearchProductList_ |
| Indexes | Select the index name used when deciding whether to product with a text or with an option.
For example: _DancingGoat.Pages_ |
| Path | Type _./%_ to display all pages on levels in the product tree below the product listing page. |
| Page types | Select those page types which are then displayed.
Typically, select all product page types. |
| Search options | Specify what syntax the search recognize.
See [Smart search syntax](https://docs.kentico.com/k10/configuring-kentico/setting-up-search-on-your-website/smart-search-syntax.md) to learn more information. |
| Transformation | Select the transformation you created for the product listing pages.
For example: _DancingGoat.Transformations.SmartSearchProductList_ |
6. **Save & Close** the web part properties dialog.
7. Edit the **Smart search filter** web part which should display the filtered data in the just created **Smart search results** web part.
8. In the **Search dialog web part ID** field, type the name (web part control ID) of the **Smart search results** web part (for example, _SmartSearchProductList_).
9. Click **Save & Close**.
- Repeat the steps 7–9 for every **Smart search filter** web part that displays the filtered data in the **Smart search results** web part.
The system places the web part on the page and customers can filter your products.
> **Tip:** To add the product detail page, see [Configuring product pages](https://docs.kentico.com/k10/e-commerce-features/configuring-your-store/configuring-product-pages.md). To combine it with the product filter, leave the **Transformation** field empty and select only the **Selected item transformation** field.