1. Search experiences

Filters

Version:

Using filters is a common way to reduce the number of search results, so the site visitor can find the content they're interested in faster. A search filter limits the search results before Sitecore Search returns them to your app.

For example, you can use filters:

  • On the product search page of your app to request only those product index documents that have the in-stock attribute, and not those that have the out-of-stock one.

  • In the news section of your app to return only search results with a news attribute, and in the blogs section to return only those with a blog attribute.

Filter types

You can use the following types of filters, available in various filter classes, to filter search results:

Filter type

Description

Examples

Comparison filter

Filter index documents by their attributes. You can compare values by checking if a value is equal to, greater than, greater than or equal to, less than, or less than or equal to some other value.

Return only those search results where the price attribute is less than or equal to "20".

List filter

Return search results if all or any of a set of values are included in a certain attribute.

Return only those search results where the type attribute matches all or any of the following values: "video", "film", "audio".

Logical filter

Either return or exclude search results that match a specific set of filters. Use this to build complex filters.

Return search results where the type attribute is not "blog", or return results where the type attribute is either "blog" or "pdf".

Geo filter

Return search results depending on the radius of a circular geographical area.

By default, Sitecore Search returns search results based on the site visitor's geolocation, defined in the search context. You can use the geo filter to override the default behavior and show search results for a different location.

This is useful when, for example, the site visitor is in Barcelona but wants to find store locations in Madrid.

Return search results within a 6km radius of Barcelona Sants railway station.

Geo within filter

Return search results depending on an area defined by polygon area coordinates.

Return search results within an area defined by three pairs of latitude and longitude coordinates.

You can combine multiple types of filters to precisely control what search results to return.

Examples

Example 16. Comparison filter for product color

Here's an example comparison filter that returns search results where the color attribute is equal to "red":

import { ComparisonFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new ComparisonFilter("color", "eq", "red");


Example 17. List filter for product color

Here's an example list filter that returns search results where the color attribute contains both "red" and "blue". For example, an index document where color is ["print black", "blue", "green", "red"] will be returned. But an index document where color is ["red", "green"] will not be returned because "blue" is absent:

import { ListFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new ListFilter("color", "allOf", ["red", "blue"]);


Example 18. Comparison filter and logical filter for brand

Here's an example comparison filter and logical filter that returns search results where the brand attribute is equal to "AeroStride" or "Sneakers4All":

import { ComparisonFilter, LogicalFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new LogicalFilter("or", [
  new ComparisonFilter("brand", "eq", "AeroStride"),
  new ComparisonFilter("brand", "eq", "Sneakers4All"),
]);


Example 19. Comparison filter and logical filter for product price

Here's an example comparison filter and logical filter that returns search results where the price attribute is less than or equal to 20 and greater than or equal to 10:

import { ComparisonFilter, LogicalFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new LogicalFilter("and", [
  new ComparisonFilter("price", "lte", "20"),
  new ComparisonFilter("price", "gte", "10"),
]);


Example 20. Other comparison filters for product price

Here's an example containing multiple comparison filters that return search results where the price attribute is equal to, greater than or equal to, greater than, less than, or less than or equal to 10:

import { ComparisonFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});

widgetRequest.filter = new ComparisonFilter("price", "eq", "10"); // Equal to
widgetRequest.filter = new ComparisonFilter("price", "gte", "10"); // Greater than or equal to
widgetRequest.filter = new ComparisonFilter("price", "gt", "10"); // Greater than
widgetRequest.filter = new ComparisonFilter("price", "lt", "10"); // Less than
widgetRequest.filter = new ComparisonFilter("price", "lte", "10"); // Less than or equal to


Example 21. List filter for product size

Here's an example list filter that returns search results where the size attribute is either "small" or "medium":

import { ListFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new ListFilter("size", "anyOf", ["small", "medium"]);


Example 22. Geo filter with radius

Here's an example geo filter that returns search results within a 100km radius of a certain latitude and longitude:

import { GeoFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new GeoFilter("geo_location", {
  distance: "100km",
  location: {
    latitude: 40.4634321,
    longitude: -3.7130504
  }
});


Example 23. Geo within filter - triangular area

Here's an example geo within filter that returns search results within a three-sided polygonal area, in this case a triangle, defined by three pairs of latitude and longitude coordinates:

import { GeoWithinFilter, SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

const widgetRequest = new SearchWidgetItem("product", "rfkid_7", {});
widgetRequest.filter = new GeoWithinFilter("geo_location", [
  {
    latitude: 39.5699454,
    longitude: 2.6395557
  },
  {
    latitude: 37.253554,
    longitude: -7.148912
  },
  {
    latitude: 43.538415,
    longitude: -7.461614
  }
]);


If you have suggestions for improving this article, let us know!