Coveo Query Suggest Preview
Coveo Query Suggest Preview
Legacy feature
This article pertains to the Coveo Hive framework which is now in maintenance mode. Choose one of Coveo’s more modern, lightweight, and responsive libraries for any future search interface development. See the search interface Implementation guide for more details. |
Implements the Coveo JavaScript Search Framework QuerySuggestPreview component which renders previews of the top query results matching the currently focused Coveo Machine Learning-powered query suggestions.
Usage notes
-
To use the Coveo Query Suggest Preview rendering, you first need to enable Query Suggestions in your search interface, which involves creating a machine learning model and feeding it analytics data (see Enabling query suggestions).
-
In the Coveo Query Suggest Preview rendering data source, you must select a result template that has been inserted in the current search page.
-
You can customize the CSS associated with this rendering.
Insertion location
Coveo Hive
The Coveo Query Suggest Preview rendering is an Allowed Control in the following placeholder(s): Searchbox Components
Coveo Hive SXA
When you add the Coveo Searchbox SXA rendering, this adds a coveouisearchboxcomponentssxa
placeholder. Insert your Coveo Query Suggest Preview rendering in this coveouisearchboxcomponentssxa
placeholder.
Data source options
The following table lists the available data source options for this rendering.
Option name | Description |
---|---|
Execute query delay |
See the executeQueryDelay component option. |
Number of preview results |
See the numberOfPreviewResults component option. |
Result template |
Allows selecting a result template, present in the current page, from a list of Coveo File Result Template and Coveo Item Result Template data source item names (see the resultTemplate component option). |
DOM unique ID |
Randomly generated HTML element ID. |
Additional data attributes |
Allows use of the Coveo JavaScript Search Framework QuerySuggestPreview component options that aren’t directly available in the data source. |
Sample generated HTML and corresponding visual output
<div id="coveo405cec6f" class="CoveoQuerySuggestPreview" data-execute-query-delay="10"
data-number-of-preview-results="4" data-prebind-result-template-selector="itemIdSelector"
data-result-template-selector="#coveo7251E2B7" data-applied-prebind="true">
</div>