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 configobject, add facets as SearchResultsStoreSelectedFacet object as shown in the following code block.

    RequestResponse
    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.

    RequestResponse
    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.

Do you have some feedback for us?

If you have suggestions for improving this article,