facets( )
Categorizes search results according to the specified facets.
Description
The facets()
function allows you to categorize search results according to one or more
specified fields.
For example, if you have a sports equipment store with products divided into collections
of Basketball
, Football
, and Baseball
equipment, you can apply collections
as a facet to your search
and get information about how many documents in the search results are included in each collection.
If you chained a facets()
function to your search, your WixSearchResult
will include an array of facet results.
Faceting is a useful tool for presenting categorization data to site visitors and allowing them to narrow down and navigate search results. Visitors can select one or more facets, and you can apply corresponding filters to your search results.
By default, facets()
is set to none.
You cannot apply facets to your search if the documentType
is set to "Site/Pages"
.
Only some fields can be used for faceting. You can check which fields are facetable in the schema for each documentType
.
Syntax
function facets(facets: ...string): WixSearchBuilder
facets Parameters
NAME
TYPE
DESCRIPTION
The fields to use as facets.
Was this helpful?
1let newSearch = search2 .documentType("Stores/Products")3 .facets("inStock");
1let newSearch = search2 .documentType("Forum/Content")3 .facets("likeCount", "viewCount");
1import wixSearch from 'wix-search';23// ...45wixSearch.search()6 .documentType("Stores/Products")7 .facets("collections", "inStock")8 .find()9 .then( (results) => {10 const facets = results.facets;11 })12 .catch( (error) => {13 console.log(error);14 });1516 /* Example facets array17 *18 * [19 * {20 * "facet": "collections",21 * "facets":22 * [23 * {24 * "facetValue": "Winter",25 * "count": 2926 * },27 * {28 * "facetValue": "Spring",29 * "count": 1730 * },31 * {32 * "facetValue": "Summer",33 * "count": 3634 * }35 * ]36 * },37 * {38 * "facet": "inStock",39 * "facets":40 * [41 * {42 * "facetValue": "true",43 * "count": 6744 * },45 * {46 * "facetValue": "false",47 * "count": 1548 * }49 * ]50 * }51 * ]52 *53 */
This example demonstrates how to display facet information for store products and let site visitors filter the products by
selecting a facet. We use 2 repeaters, 1 to display the facet info and 1 for the products. We apply
the collections
field as a facet to our search. Each facet value and number is loaded into the facet repeater. When a site visitor
selects a facet, the products are filtered according to the selected collection.
1import wixSearch from 'wix-search';23$w.onReady(function () {45 // Define what happens when the facet repeater's data is set6 $w("#facetRepeater").onItemReady(($item, itemData) => {7 $item("#facetText").text = itemData.facetValue;8 $item("#facetNumberText").text = "(" + itemData.count + ")";910 // When a facet is selected, run the function11 // that displays only the selected products12 $item("facetText").onClick(event => {13 const facet = $item("#facetText").text;14 displaySelectedProducts(facet);15 });16 });1718 // Define what happens when the product repeater's data is set19 $w("productRepeater").onItemReady(($item, itemData) => {20 $item("#productTitleText").text = itemData.title;21 $item("#productDescriptionText").text = itemData.description;22 $item("#productImage").src = itemData.image;23 });2425 // Run a search which applies a facet that categorizes store26 // products according to the collection they belong to27 wixSearch.search()28 .documentType("Stores/Products")29 .facets("collections")30 .find()31 .then((results) => {3233 // Get the first (and only) facet result34 const facets = results.facets[0].facets;3536 // Add an ID to each object in the facets37 // array (required for repeater data)38 const newFacets = facets.map((facet) => {39 facet._id = facet.facetValue;40 return facet;41 });4243 // Set the facet repeater's data44 $w('#facetRepeater').data = newFacets;45 // Set the initial pre-filtered product repeater's data46 $w('#productRepeater').data = results.documents;47 });48});4950// Display only products from the collection51// corresponding to the selected facet52export function displaySelectedProducts(facet) {53 wixSearch.search()54 .documentType("Stores/Products")55 .hasSome("collections", [facet])56 .find()57 .then((results) => {58 $w('#productRepeater').data = results.documents;59 });60}