Integrating Search Suggest

The following section explains how to integrate the Fredhopper Suggest service for type-ahead search suggestions in the search bar on your front-end web application.

Overview

The Fredhopper Suggest service will return the defined search suggestions in a JSON-format HTTP response. Each time a user inputs a keystroke in the search bar on the website, the front-end web application should send a GET HTTP request to the Fredhopper Suggest API with the text value and then display the response that is returned. The system can be designed to give a default response when a user clicks into the search bar but has not yet made a keystroke entry. Please contact your Technical Consultant for more information on how this can be configured. You might also decide to have the front-end wait for the user to type the first 3 characters of the search term before sending the first query to Fredhopper Suggest to retrieve the suggestions to display. This is in order to give them more focused and relevant results.

If the Fredhopper Suggest Query Server is not available or does not contain an index, the sample Fredhopper Ajax module will not show the suggest drop down. For custom Ajax modules, it is highly recommended to foresee this situation since it occurs, e.g. during index updates.

Fredhopper Suggest API

Request

The format to retrieve suggestions for a specific term should be sent in the following query string format:

/suggest/json?search=KEYWORD&scope=//UNIVERSE/LOCALE

Response

The JSON-format response that you receive will contain the suggestions for each defined index in the following format:

{"suggestionGroups":[
  {
    "indexName":"<INDEX_NAME>",
    "indexTitle":"<INDEX_NAME>",
    "suggestions":[
      {"<FIELD_A_1>":"<VALUE_A_1>",
       "<FIELD_A_2>":"<VALUE_A_2>"},
      {"<FIELD_B_1>":"<VALUE_B_1>",
       "<FIELD_B_2>":"<VALUE_B_2>"},
      ...
    ]
  },
  ...
]}

Example

Request

The following query string should be sent to get the suggestions for the keyword/keystrokes 'nic' from the universe 'catalog01' in the English (GB) locale:

/suggest/json?search=nic&scope=//catalog01/en_GB

Response

In this particular example, the response that is returned contains the following two sections:

• Two keyword suggestions for the terms nicam and nicky

• One category suggestion for Mens / Nightwear (where additional information about the number of results and the Fredhopper Location String have been provided)

{"suggestionGroups":[
  {
    "indexName":"Keywords",
    "indexTitle":"Keywords",
    "suggestions":[
      {"searchterm":"nicam"},
      {"searchterm":"nicky"}
    ]
  },
  {
    "indexName":"Categories",
    "indexTitle":"Categories",
    "suggestions":[
      {"nrResults":17,
       "fhLocation":"//catalog01/en_GB/categories<{catalog01_15003}",
       "mlValue":"Mens / Nightwear"}
    ]
  }
]}

It is possible to use our JSCRIPT endpoint alternatively using the following format

- /suggest/jscript?search=KEYWORD&scope=//UNIVERSE/LOCALE&callback=FUNCTIONNAME

The different sections and the display fields within each section can be customised for your specific requirements. It is possible to make amendments to these at a later stage as requirements and business needs develop over time. You can contact your Technical Consultant for more information on this.