Coveo Query Suggest Preview

Warning
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

Example insertion sequence for the Coveo Query Suggest Preview rendering.

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.

Example insertion sequence for the Coveo Query Suggest Preview rendering.

Data source options

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>
Query Suggest Preview Animation | Coveo for Sitecore 5