---
title: "Customize facets in a search results widget"
slug: "customize-facets-in-a-search-results-widget"
abstract: "How to override behavior and set initial values of facets of a search results widget using Sitecore Search JS SDK."
---
# Customize facets in a search results widget

When you have faceted content, you might need to add initial values to the facets or override their default behavior in a search.

For example, for a previously configured `artifact_type` facet to match by facet ID, you need to override how the facet is handled, provide a string, and set it as the initial value.

> [!note]
> A faceted search runs successfully when there is a match between the facet's `SearchResultsStoreSelectedFacet` and `SearchResultsFacetConfigItem`.

The following procedures are applicable to the typical use cases you encounter when customizing facets. They are independent of each other, and can be used one at a time.

## Override how facets are handled

When using facets in a search, by default, the matches are based on `facetId`. You can use this procedure when you want to override this default behavior.

To override how facets are handled:

- In the `useSearchResults` query hook, in the `config`object, add facets as `SearchResultsStoreSelectedFacet` object as shown in the following code block.

    ```csharp
    useSearchResults<EntityModel, InitialState>({
        state: {
          sortType: defaultSortType,
          page: defaultPage,
          itemsPerPage: defaultItemsPerPage,
          keyphrase: defaultKeyphrase,
        // Lists the facets and they behave and match with the CEC.
        // All facets default to valueId or match by comparing valueIds.
        // Selected facet value types in the inital state must match this model.
        config: {
          facets: {
            word_count: { type: 'range' },
            museum: { type: 'valueId' },
            artifact_type: { type: 'text' }
          },
        },
      })
    ```

    > [!note]
    > Faceted searches only run for attributes that have been configured in the **Facets** section of the Sitecore Search user interface.

## Add initial values for facets

To add initial values for facets:

- In the `useSearchResults` query hook, in the `state` object, to the `selectedFacets`, add desired facets as shown in the following code block.

    ```csharp
    useSearchResults<EntityModel, InitialState>({
        state: {
          sortType: defaultSortType,
          page: defaultPage,
          itemsPerPage: defaultItemsPerPage,
          keyphrase: defaultKeyphrase,
          // Use selected facets property to set initial values for facets
          // Unless specified otherwise in the config object, a facet matches by facetId.
          // In case of conflict, the config or default behavior is applied.
          selectedFacets: [
            {
              facetId: 'museum',
              facetValueId: 'facetid_eyJ0eXBlIjoiZXEiLCJuYZXIgV29uZGVyIExhbmUifQ==',
            },
            {
              facetId: 'word_count', // => should be handled as a range
              min: 200,
              max: 800,
            },
          ],
        }
      })
    ```

    > [!note]
    > Faceted searches only run for attributes that have been configured in the **Facets** section of the Sitecore Search interface.