Tutorial for a basic setup

Last updated on

25 January 2022

This page will guide you through the steps of setting up and configuring Autocomplete for search forms on your site.
It builds upon the steps in the Search API "Getting started" guide – so, you should already have one or more search servers, search indexes and search pages set up.

Enabling Autocomplete searches

After installing the Search API Autocomplete module, go to the Search API admin overview screen. Here you will notice that all indexes now have an additional tab (and actions dropdown option), labelled "Autocomplete". Go to that tab and you will see a list of all of the index's searches that support Autocomplete, with checkboxes next to them. (If you don't see any forms there, refer to "Search forms and results pages" for creating a search page. Both Views and Search API Pages support Autocomplete.) Clicking the "Save" button will then create an "Autocomplete search" entity for each checked search. From that point on, those search forms should already provide autocomplete suggestions when a user types in them. (If you're using a Beta version of the module, you might need to clear cache before such changes take effect, though.)

Important: If you, for example, want to use the title field for the autocomplete field you must set it to "fulltext" not to "string"

Editing the autocomplete configuration

When autocomplete is enabled for a search, it is automatically configured with default settings. Click "Edit" next to a search in order to review and customize those settings. You'll see the following settings:

Enabled: This allows you to disable autocompletion for a search again, without having to delete the settings entirely.
Suggester plugins: Configure the suggester plugins used to create autocomplete suggestions. You'll need at least one suggester for a search, but can also combine multiple suggesters. In the latter case you can manually order them and also set individual limits for the number of suggestions provided by each. Furthermore, most suggesters come with a configuration form with additional, suggester-specific settings.
Search-specific settings: Depending on the search for which autocomplete is being configured, there might be additional settings available. For example, in the case of search views you can restrict the autocomplete functionality to specific displays.
General/Advanced options: You will also see some additional options which are always available, like the maximum number of suggestions to display, the minimum number of characters the user must type to trigger autocomplete, etc. In most cases the defaults should be fine for those, but review them and maybe experiment in cases where autocomplete doesn't work as expected (or causes performance problems for your site).; Video; A video by drunken monkey himself. Very helpful to learn.; https://www.youtube.com/watch?v=ZVuR9QTBAGY; Also a good tutorial; https://www.youtube.com/watch?v=OoMZPU4EGrU; Another video from drunken monkey Amserdam 2019; https://www.youtube.com/watch?v=e5-3RZkKFOQ