Using APIs, you can get your ServiceNow instance to integrate with QuickHelp and help your users help themselves. This support document details the steps needed to complete the search integration.

Prior to configuring the QuickHelp integration in ServiceNow, please ensure that the global glide.service_portal.search_as_you_type_behavior setting is set to Typeahead. New ServiceNow tenants have this value set, by default, to Suggestions, and will cancel out the Typeahead configuration in the QuickHelp configuration itself. 

  1. Enter sys_properties.list In the Flight Navigator filter at the top left of the Administrator window
  2. Hit Enter (on your keyboard)
  3. Select Name from the Search pulldown menu
  4. Enter glide.service_portal.search_as_you_type_behavior in the Search field
  5. Hit Enter (on your keyboard)
  6. Click glide.service_portal.search_as_you_type_behavior from the results list (should be the first one in the list
  7. Change the Value in the configuration from Suggestion to Typeahead.
    NOTE: If it's already set to Typeahead, great.
  8. Click Update
    NOTE: This change may take up to an hour to populate.

QuickHelp Integration

  1. Follow the steps in the QuickHelp APIs – Getting Accessdocument to access APIs and to get the API keys required to send requests.
    1. The API key from the QuickHelp Admin portal will be used in your API requests as the Authorization header (you will replace it in the template code provided in step 7). Click here to go to the QuickHelp Admin portal.
    2. The key from the Azure API portal will be used in your API requests as the Ocp-Apim-Subscription-Key header. Click here to go to the Azure API portal.
  2. Sign in to your ServiceNow instance (as an Admin)
  3. Search for Portals
  4. Click Portals from the results
  5. Click the active portal that you would like to integrate with QuickHelp search
  6. Scroll down to Search Sources
  7. Click New
  8. In the Search Source config page – enter the Name and ID that you would like to give the integration

  9. At the top of the Search Source page, in the Search page template itself, use the Search code below
    NOTE: You can also use HTML to modify the template to suit your own needs.  
  10. In the Data Source section, check Is Scripted Source

  11. Using the Data fetch script code below, replace the Authorization key with the API key you received from QuickHelp Admin portal and the Ocp-Apim-Subscription-Key with the key from the Azure API portal (found in step 1)
  12. Replace the code in the Data fetch script field with the code below (including your Authorization key and Ocp-Apim-Subscription-Key)
  13. Now click the Typeahead section
  14. Ensure that Enable typeahead and Advanced typeaheadconfig are both checked
  15. Using the Typeahead script below, put this code in the Typeahead template field
  16. Click Submit
  17. You can test the new search by scrolling down in the Portal configuration and clicking Try It

  18. Type in search criteria in your search text box (something that relates to QuickHelp content)

  19. Use the QuickHelp filter (or whatever you named the Search Source) at the left to see the QuickHelp results.

Data fetch script

(function(query) {
	var results = [];
	var url = "";
	var numResultsToReturn = 10; // NOTE: If you would like, you can configure the amount of results that QH returns by changing this number
	var ws = new sn_ws.RESTMessageV2();
	ws.setQueryParameter('query', encodeURI(query));
	ws.setQueryParameter('limit', numResultsToReturn);
	ws.setQueryParameter('typeId', 3);
	ws.setQueryParameter('utm_source', 'API');
	ws.setQueryParameter('utm_medium', 'ServiceNow');
	ws.setQueryParameter('utm_campaign', 'Search');
	var jsonOutput = ws.execute();	
	if(jsonOutput) {
		var response = new JSON().decode(jsonOutput.getBody());  
		// Format result for how it should appear in search results
		response.forEach(function(result) {
            result.url = result.url + '?utm_source=API&utm_medium=ServiceNow&utm_campaign=Search';
			results.push({"url": result.url, "target": "_blank", "primary": result.title, "description": result.description, "thumbnail": result.thumbnail});
	// ServiceNow displays the results in reverse order
	return results.reverse();

Typeahead script

<div style="cursor: pointer">
  <i class="ta-img" style="background-image:url('')"></i>
  <span ng-bind-html='match.label'></span>

Search code

<div style="box-sizing: border-box; display: flex; align-items: center;">
  <div style="display: inline-block; width: 20%; margin-right: 20px;">
              <img src="{{item.thumbnail}}" style="width: 100%;"/>
  <div style="display: inline-block; width: 80%;">
    <a href="{{item.url}}" target="_blank" class="h4 text-primary m-b-sm block">