Facets
Facets are search filters that allow users to refine their search results based on specific criteria such as size, brand, price, or category. By using facets, users can narrow down large datasets quickly, improving the overall search experience.
To use a facet, include it on the Product Catalog or Product Catalog for ViewModel app used to show the product list. You will then have access to the facet groups and facets in your templates and can render them in frontend.
Note
Facets cannot be fully understood in isolation because they are dependent on other components like indexes, queries, and parameters. Each of these elements plays a crucial role in how facets operate and interact with the data. For an overview of how all these elements work together, you can check out the Product Search with Facets guide, which will walk you through the underlying system that facets are built upon.
Creating Facets and Facets Groups
To create a facet, you first need to set up a facet group, which acts as a container for related facets. The facet group helps organize your facets by category (e.g., "Products"). Once the facet group is created, you can add individual facets to it (e.g., "Brand", "Color", "Price Range").
To create a facet group:
- Navigate to Settings > System > Repositories
- Fold out the repository and index you want to create facets for
- Find the appropriate query - typically the one used to publish products to frontend
- Open the context menu and click Add facet group
- Provide a name
- Save
Fold out the query in the tree and click the facet group to open the interface where you create facets:
To add a facet to this facet group:
- Click Add new facet
- Provide a Name
- Select a Facet type
- Field facets: Automatically create a facet option for each unique value in a field. Use this when you want to display every available value in a field (e.g., all brands)
- List facets: Group field values under custom labels. Use this when you want to organize related values under broader labels (e.g., grouping a subset of colors under "Spring Colors")
- Term facets: Automatically generate facet options from the 2048 most frequently occurring values in the selected field. This is useful for fields with many potential values, such as tags, where you want to focus on the most common values
- Select the Query parameter to pass values to
- Specify a Render type
- Save
Conditional Facets
When you create a facet, the Show-settings allows you to show this facet only under certain conditions, such as if another facet has a value.
To implement a condition on a facet:
- Create the facet like any other
- Under Show, select Conditionally to control when the facet is displayed
- Select a query parameter. Choose the query parameter that will trigger the facet to appear
- Choose HasValue or HasSpecificValue as appropriate
- HasValue: Displays the facet when any value is selected
- HasSpecificValue: Displays the facet only for a specific value
- Save
For example: An online store sells various types of bikes. They want a facet for "Battery Type", but this facet should only be visible when the user selects "Electric Bikes" from the Category-facet, as it is irrelevant for non-electric bikes. By using the Conditionally option on the "Battery Type" facet, this facet only appears when the Category facet is set to "Electric Bikes".
Example with Bikes and Brands
To get an idea how facets work, let's look at an example. Consider a product catalog with various bikes, each belonging to a specific brand:
Product Name | Brand | Price | Category |
---|---|---|---|
Schwinn Sid Coasting Bike | Schwinn | €155.82 | Classic |
Mongoose Crossway 450 Disc | Mongoose | €163.82 | Hybrid |
Mongoose Crossway 450 Disc Lady | Mongoose | €195.65 | Hybrid |
Merida 34XZA | Merida | €159.79 | Mountain |
Step-by-Step process of how facets work:
- Query: A query retrieves all bikes from the product catalog, including fields like Brand, Price, and Category
- Field: The Brand field contains values such as "Schwinn", "Mongoose" and "Merida"
- Facet Setup: A facet is created for the Brand field, allowing customers to filter bikes by selecting a brand
- Frontend Display: The facet for Brand appears in the sidebar, as shown in the image above, displaying checkboxes for each brand
- User Interaction: A customer wants to see only bikes from the brand "Mongoose", and selects "Mongoose" from the facet
- Filtering Process:
- The facet passes the Brand = Mongoose parameter to the query which reruns, filtering the results to only show bikes where the Brand field is "Mongoose"
- Result: The filtered product catalog now shows only Mongoose bikes:
- Mongoose Crossway 450 Disc Lady – €195.65
- Mongoose Crossway 450 Disc – €163.82
Common Pitfalls when using Facets
If you're not familiar with how facets works, you can easily fall into common pitfalls when configuring facets:
- Faceting an Analyzed Fields: Faceting on analyzed fields (e.g., descriptions) slows down performance and creates cluttered UI. Instead, use non-analyzed fields like tags or categories. To better understand what an analyzed or non-analyzed field is, check out the documentation.
- Irrelevant Facets: Showing irrelevant facets (e.g., "Battery Type" for non-electric bikes) confuses users. Use conditional facets to only display relevant options based on other selections.
- Improper Data Types: The data type of values in a field is crucial for correct faceting. For example, if dates are treated as text instead of date types, sorting and filtering by date will be inaccurate.