Skip to main content

Implementing Search Suggestions Autocomplete in AddSearch

AddSearch generates search suggestions automatically based on your users' searches on your website. These suggestions improve in relevance as the volume of searches grows. You can also extend suggestions using custom fields or manual additions.

This guide explains how to enable and implement search suggestions autocomplete using the AddSearch dashboard, Search UI Library, and API.

Enable Search Suggestions in AddSearch Dashboard​

  1. Open your AddSearch dashboard.
  2. Follow the steps in the Setting Up Search Suggestions guide to configure the suggestions database.

Enable Suggestions via Search Designer​

You can control search suggestions in both the Widget and the Separate Results Page views through the Search Designer:

  1. Open the Search Designer.

For Widget View​

  1. Click the Widget tab.
  2. Under the Basic tab, find the Show suggestions option.
  3. Toggle the checkbox to enable or disable search suggestions.

For Separate Results Page View​

  1. Click the Separate Results Page tab.
  2. Under the Basic tab, find the Show suggestions option.
  3. Toggle the checkbox to enable or disable search suggestions.

When enabled, the following configuration appears in your exported settings object:

"show_search_suggestions": true

Note: Check the current version of the dashboard interface if this option name or location differs.

Using the Search UI Library Autocomplete Component​

Implement search suggestions autocomplete using the Search UI Library's autocomplete component.

Search suggestions autocomplete component

For additional context and setup, visit:

Prerequisite: This method requires familiarity with HTML and JavaScript.

Using the API for Search Suggestions​

You can fetch search suggestions programmatically via the AddSearch REST API.

We recommend using the AddSearch JavaScript API Client for this purpose.

Example API call​

To get suggestions for the term "api":

HTTP GET:

https://api.addsearch.com/v1/suggest/1bed1ffde465fddba2a53ad3ce69e6c2?term=api

Using AddSearch JavaScript Client:

client.suggestions('api', callback);

Refer to the API reference for suggestions for more details.

By enabling and implementing search suggestions, you enhance your site's search experience by providing dynamic and relevant autocomplete options to users as they type.