> ## Documentation Index
> Fetch the complete documentation index at: https://help.experro.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Autocomplete

## Autocomplete Settings

The Autocomplete module lets you fine‑tune every aspect of how search suggestions and product previews appear as users type in your search bar. You can configure the trigger threshold, choose from multiple layout templates, control which suggestion blocks are shown (products, search terms, categories, content pages), and define mobile‑specific behaviors—all from one unified interface.

### 1. Enabling Autocomplete

* **Toggle On/Off**\
  Enable or disable Autocomplete globally for desktop and mobile views.
* **Trigger Threshold**\
  Specify how many characters a user must type before suggestions appear (options: 2, 3, 4, or 5; default: 3).

### 2. Popover Layout

Choose the visual arrangement of suggestion blocks:

| Layout                 | Description                                                                 |
| ---------------------- | --------------------------------------------------------------------------- |
| **Vertical** (default) | Suggestions list vertically on the left; product previews on the right.     |
| **Horizontal**         | Search terms, categories, and content appear above; product previews below. |
| **Minimalistic**       | A compact list combining all suggestion types.                              |

***

### 3. Product Card Layout

#### View Mode

* **Grid View** (default)\
  Displays product thumbnails in a multi‑column grid.
* **List View**\
  Shows products in a single column with extended details.

#### Attributes to Show

Select which fields appear on each product card. At least one is required; defaults are **Image**, **Name**, and **Price**. Additional options include:

* SKU
* Brand
* Short Description
* Rating
* Inventory Level

Drag‑and‑drop to reorder, or remove attributes with a single click.

### 4. Suggestion Blocks

Enable, disable, and configure each block of the Autocomplete dropdown:

| Block                        | Toggle | Count (1–20) | Additional Options              |
| ---------------------------- | :----: | :----------: | ------------------------------- |
| **Product Suggestions**      |   ✔️   |   Default 5  | Show product count              |
| **Search Term Suggestions**  |   ✔️   |   Default 5  | Highlight matching text         |
| **Category Suggestions**     |   ✔️   |   Default 5  | Show product count per category |
| **Content/Page Suggestions** |   ✔️   |   Disabled   | —                               |

Use drag‑and‑drop in the “Search Result Order” panel to change the vertical ordering of these blocks.

### 5. Quick‑Click Suggestions

Define what appears when users click into the search box **before** typing:

* **Popular Searches**\
  Show most‑searched terms (count configurable 1–20; default 5).
* **Recent Searches**\
  Display the user’s own recent queries (configurable 1–20; default 5).
* **Search Product Recommendations**\
  If no input, show a pre‑built recommendation widget or custom product list when user clicks on the search box.

### 6. No‑Results Handling

* **Custom No‑Results Message**\
  Enter the custom message; include `<%= searchTerm %>` to dynamically insert the user’s query.
* **Fallback Recommendations**\
  Toggle on to display a recommendation widget titled by you; toggle off for no suggestions.

### 7. Mobile View Overrides

All of the above settings can be overridden for mobile:

* **Layout**: Choose between **Horizontal** or **Minimalistic** layouts.
* **Block Order & Visibility**: Enable or disable blocks independently from desktop.
* **Trigger Threshold**: Optionally set a higher or lower character count for mobile.

Use the **Desktop/Mobile** tabs at the top of the Autocomplete page to switch contexts.

By tailoring these Autocomplete settings, you’ll deliver faster, more relevant suggestions that guide shoppers to the right products with fewer keystrokes—driving engagement and conversions.
