Choose the sorting for organic results

Define how Algolia sorts organic results that aren’t part of Smart Groups.

Use compositions to define sorting strategies and apply them at runtime.
With sorting strategies, you can sort organic results at query time based on price, recency, popularity, or custom business logic from your Algolia indices.

Define sorting strategies with the API

To configure sorting behavior programmatically, use the Composition API. The following explains how to set and apply sorting strategies.

Set sorting strategies in a composition

You can use the Composition API to configure the sorting strategy programmatically.

The sorting strategies are defined in the sortingStrategy parameter (available at root level):

JSON

{
  "sortingStrategy": {
    "Price (asc)": "Products-sorted-by-price-low-to-high",
    "Price (desc)": "Products-sorted-by-price-high-to-low",
    "Newest": "Products-sorted-by-newest"
  }
}

sortingStrategy is a key/value store where:

• Key is the sorting label your UI will send at run time (for example Price (asc))
• Value is the Algolia index or replica to use when this sorting is selected (for example Products-sorted-by-price-low-to-high)

Select a sorting strategy at runtime

When querying your composition, you can select the sorting strategy to apply to Smart Group results by sending the sortBy parameter with your search query.

JSON

{
  "params": {
    "sortBy": "Price (asc)"
  }
}

• The value sent with sortBy must match one of the keys defined in the composition’s sortingStrategy map. If no match is found, sortBy is ignored.
• The order of items defined in the Smart Group remains fixed. Only the organic results are affected by sortBy.
• If a composition rule applies to the query, it’s applied first. Then, the sorting strategy affects the organic results defined by that rule.

This ensures predictable behavior, especially when Smart Groups include mixed sources.

Integrate with InstantSearch

Composition sorting strategies require these versions of the InstantSearch libraries:

• React InstantSearch: version 7.22.1 or later
• InstantSearch.js: version 4.86.1 or later
• Vue InstantSearch: version 4.22.8 or later

For more information, see Integrate compositions with InstantSearch.

InstantSearch.js

To apply the sorting strategies, use the sortBy widget with strategy instead of value on the items option.

JavaScript

sortBy({
  items: [
    { label: "Price (asc)", strategy: "Price (asc)" },
    { label: "Price (desc)", strategy: "Price (desc)" },
    { label: "Newest", strategy: "Newest" },
  ],
});

React InstantSearch

To apply the sorting strategies, use the SortBy widget with strategy instead of value on the items property.

React

<SortBy
  items={[
    { label: "Price (asc)", strategy: "Price (asc)" },
    { label: "Price (desc)", strategy: "Price (desc)" },
    { label: "Newest", strategy: "Newest" },
  ]}
/>

Vue InstantSearch

To apply the sorting strategies, use the ais-sort-by widget with strategy instead of value on the items property.

Vue

<ais-sort-by
  :items="[
    { value: 'Price (asc)', strategy: 'Price (asc)' },
    { value: 'Price (desc)', strategy: 'Price (desc)' },
    { value: 'Newest', strategy: 'Newest' },
  ]"
/>