---
sourceDocument: Australia ServiceNow AI Platform user interface
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/platform-user-interface

 Release :

    - australia

ft:locale :

    - en-US

ft:publication_title :

    - Australia ServiceNow AI Platform user interface

ft:clusterId :

    - platux

bundleId :

    - platux

workflow :

    - Platform


---

# Create an advanced typeahead template

# Create an advanced typeahead template {#ariaid-title1}

* Release version: Australia
* 
* Updated August 14, 2026
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 minute to read

Configure the way typeahead results display with an advanced template.

## Before you begin

Note:  
Search suggestions replaces typeahead search in Service Portal. Update the glide.service_portal.search_as_you_type_behavior system property to change this behavior. For more information, see [Enable and disable search suggestions](https://www.servicenow.com/docs/access?context=enable-search-suggestions&version=australia&pubname=australia-platform-administration&ft:locale=en-US). Service Portal search widgets automatically use whichever feature you enable.

Role required: admin

## Procedure

1. Complete the required fields in [Define a search source](https://servicenow-prod.fluidtopics.net/fl69Wo2bO72DkB1FBiQJog "Configure a basic search source to query data from an instance table, or configure an advanced data fetch script to query data across multiple tables and data sources, or to pull data from anywhere on the web.").
2. In the Typeahead tab of the Search Source record, select the Advanced typeahead config check box.
3. In the Typeahead template field, add an HTML template.  
   This example uses AngularJS bindings to display service catalog images in the
   typeahead results.  

       <i class="ta-img" ng-if="match.model.type=='sc'" style="background-image:url('{{match.model.picture}}')"></i> 
       <i class="ta-img" ng-if="match.model.type=='sc_guide'" style="background-image:url('{{match.model.picture}}')"></i> 
       <i class="ta-icon fa fa-file-text-o" ng-if="match.model.type=='sc_content' && match.model.content_type == 'kb'"></i> 
       <strong ng-if="match.model.type=='sc_content' && match.model.content_type == 'external'">➚</strong> 
       <span ng-bind-html="match.label | uibTypeaheadHighlight:query"></span>

4. Click Update.  
   Typeahead results display beside the image defined in the service catalog
   record.