Enabling Coveo ML Query Suggestions in a Coveo JavaScript Search Framework Search Box

Reveal-QuerySuggestionsEx3

Coveo for Salesforce 2.26 - July 2016 

In a JavaScript Search Framework search box, the Coveo ML query suggestions can be made available through the Coveo Component Omnibox.

To enable query suggestions in a Coveo JS Search Framework search box

Using the Interface Editor (see Accessing the Coveo Interface Editor):

  1. Hover over the search box, and then click the Edit icon (Icon-Edit2) (see Customize a User Interface Component).

  2. In the Searchbox Options component configuration panel, ensure that Enable Omnibox and Enable Reveal query suggestions addon are activated.

  3. It is also recommended to activate Show Omnibox result inline and Enable search-as-you-type (at the top of the panel) to maximize the Coveo ML experience.

    Show Omnibox result inline pushes down the search interface elements below the search box when the Omnibox appears rather than appearing above them.

    Enable search-as-you-type when Enable Reveal query suggestions addon is activated performs a query with the first Coveo ML suggestion when it changes as the user types in the search box. Because the search-as-you-type queries are made with full Coveo ML suggested keyword(s) rather than often incomplete keywords, the returned results are significantly more relevant.

    • Behind the scenes, the Interface Editor modifies your search page HTML markup for the Searchbox component by enabling:

      • the Omnibox

      • the Coveo ML query suggest addon

      • (optional) if the Omnibox pushes down (inline) or appears above the search results

      • (optional) the search-as-you-type option

        <div id="search" class="CoveoSearchInterface">
          ...
          <div class="CoveoSearchbox"
               data-enable-omnibox="true"
               data-enable-reveal-query-suggest-addon="true"
               data-inline="true"
               data-enable-search-as-you-type="true">
          </div>
          ...
          <div class="CoveoAnalytics"></div>
          ...
        </div>
      

      The Analytics component (div with CoveoAnalytics class) should also already be there to instruct the search interface to push search events to the usage analytics.

    • When data-enable-search-as-you-type="true", the JavaScript Search includes enableWordCompletion="true" in its request, in which case, as the first suggestion, the Query Suggestions returns the best match to complete the currently typed keyword.

      Pressing Tab completes the currently typed keyword.

      The current keyword completion has a significantly higher score than the other suggestions.

      In the Query Suggestion JSON response returned after typing dow in the search box, the first suggestion (download) has a score above 1000, while the other ones are below 17.

        {
          "completions" : [ {
            "expression" : "download",
            "score" : 1016.6772794999547,
            "highlighted" : "{dow}[nload]",
            "executableConfidence" : 1.0
          }, {
            "expression" : "set point download",
            "score" : 16.677279499954697,
            "highlighted" : "[set] [point] {dow}[nload]",
            "executableConfidence" : 1.0
          }, {
            "expression" : "unifying software download",
            "score" : 16.39136503539789,
            "highlighted" : "[unifying] [software] {dow}[nload]",
            "executableConfidence" : 1.0
          }, {
            "expression" : "setpoint download",
            "score" : 16.226351404582463,
            "highlighted" : "[setpoint] {dow}[nload]",
            "executableConfidence" : 1.0
          }, {
            "expression" : "m570 downloads",
            "score" : 15.611453176387084,
            "highlighted" : "[m570] {dow}[nloads]",
            "executableConfidence" : 1.0
          } ]
        }