More
Product news
Community
Support
Settings
Cookie preferences

AI agent context: a documentation index for this site is available at /llms.txt. A markdown version of this page is also available by appending .md to this page URL.

Home
Coveo Platform

Implementation guide
Index content
Build a search UI

Approaches

JavaScript Search Framework component equivalences

Implementation guide
Hosted search page

Create search pages with the builder

Configure query pipelines and machine learning
Add a search page to a website

Use the legacy Interface Editor

Facet types
Search result templates

Create a template
Select a template to modify
Modify the template grid
Organize components within a template grid

Customize localized strings
Identify version
Styling sections

Atomic library

Usage

Manage your project

Create a project
Download your project using the CLI
Deploy your project
Use a hosted page in your infrastructure

Display results

Display results as a list or grid
Display results as a table
Display Instant Results
Implement folding
Use result sections

Standalone search box
Use generative answering
Themes and visual customization
Use layouts
Usage Analytics

Event Protocol

Log view events with EP

Coveo UA

Log view events with Coveo UA

Content recommendations
In a framework

Use the React wrapper
Use the Angular wrapper
Usage in a Vue project

Access Headless through Atomic
Change component properties
Use external components
Modify requests and responses
Localization
Custom web components
Custom query suggestions
Accessibility

Upgrade

v2 to v3
v1 to v2

Code samples
Reference
Product lifecycle
Change log
Versioned documentation

Atomic library

Usage

Manage your project

Create a project
Download your project using the CLI
Deploy your project
Use a hosted page in your infrastructure

Display results

Display results as a list or grid
Display results as a table
Display Instant Results
Implement folding
Use result sections

Standalone search box
Use generative answering
Themes and visual customization
Use layouts
Usage Analytics

Event Protocol

Log view events with EP

Coveo UA

Log view events with Coveo UA

Content recommendations
In a framework

Use the React wrapper
Use the Angular wrapper
Usage in a Vue project

Access Headless through Atomic
Change component properties
Use external components
Modify requests and responses
Localization
Custom query suggestions
Accessibility

Upgrading from v1 to v2
Code samples
Custom components

Use and create custom components

Web components

Reference

Components

Result Template components

atomic-field-condition
atomic-quickview
atomic-quickview-modal
atomic-result-badge
atomic-result-date
atomic-result-fields-list
atomic-result-html
atomic-result-icon
atomic-result-image
atomic-result-link
atomic-result-localized-text
atomic-result-multi-value-text
atomic-result-number
atomic-result-printable-uri
atomic-result-rating
atomic-result-section-actions
atomic-result-section-badges
atomic-result-section-bottom-metadata
atomic-result-section-children
atomic-result-section-emphasized
atomic-result-section-excerpt
atomic-result-section-title
atomic-result-section-title-metadata
atomic-result-section-visual
atomic-result-text
atomic-result-timespan

Recommendation components

atomic-recs-error
atomic-recs-interface
atomic-recs-list
atomic-recs-result
atomic-recs-result-template

Common components

atomic-icon
atomic-layout-section
atomic-numeric-range
atomic-timeframe

Product lifecycle
Change log
Versioned documentation

Atomic library

Usage

Displaying results

Displaying results as a list or grid
Displaying results as a table
Displaying instant results
Implement folding
Using result sections

Standalone search box
Themes and visual customization
Use layouts
Usage Analytics

Leverage the Coveo UA library

Content recommendations
Create custom components
In a framework

Use the React wrapper
Use the Angular wrapper
Usage in a Vue project

Access Headless through Atomic
Use external components
Modify requests and responses
Localization
Custom query suggestions
Accessibility
Download your Atomic project via CLI

Code samples
Reference

Components

Result template components

atomic-field-condition
atomic-result-badge
atomic-result-date
atomic-result-fields-list
atomic-result-html
atomic-result-icon
atomic-result-image
atomic-result-link
atomic-result-localized-text
atomic-result-multi-value-text
atomic-result-number
atomic-result-printable-uri
atomic-result-rating
atomic-result-section-actions
atomic-result-section-badges
atomic-result-section-bottom-metadata
atomic-result-section-children
atomic-result-section-emphasized
atomic-result-section-excerpt
atomic-result-section-title
atomic-result-section-title-metadata
atomic-result-section-visual
atomic-result-text
atomic-result-timespan

Recommendation components

atomic-recs-interface
atomic-recs-list
atomic-recs-result
atomic-recs-result-template

Common components

atomic-icon
atomic-layout-section
atomic-numeric-range
atomic-timeframe

Product lifecycle
Versioned documentation

Headless library

Usage
Upgrade
Code samples
Reference
Product lifecycle
Change log
Versioned documentation

Headless library

Usage

Use result templates
Use a standalone search box
Implement highlighting
Usage Analytics

Event Protocol

Log view events with EP

Coveo UA

Log view events with Coveo UA

Server-side rendering

Implement server-side rendering
Extend engine definitions
Implement search parameter support
Send context

Extend controllers
Synchronize search parameters with the URL
Use dependent facets
Modify requests and responses
SAML authentication

Upgrading versions

Upgrading from v0 to v1

Code samples
Reference

Search engine

Search controllers

AutomaticFacetGenerator
BreadcrumbManager
CategoryFacet
CategoryFieldSuggestions
Context
DateFacet

RelativeDateFormat

Search actions

AdvancedSearchQuery
Breadcrumb
CategoryFacetSet
ClickAnalytics
Configuration
Context
DateFacetSet
Debug
DictionaryFieldContext
DidYouMean
FacetOptions
FacetSet
Field
Folding
GenericAnalytics
History
NumericFacetSet
Pagination
Pipeline
Query
QuerySet
QuerySuggest
QuestionAnswering
Search
SearchAnalytics
SearchConfiguration
SearchHub
SortCriteria
StandaloneSearchBoxSet
StaticFilterSet

Recommendation engine

Recommendation controllers

Context
DictionaryFieldContext
InteractiveResult
RecommendationList

Recommendation actions

AdvancedSearchQuery
ClickAnalytics
Configuration
Context
Debug
DictionaryFieldContext
Field
Pipeline
Recommendation
SearchHub

ProductRecommendation engine

ProductRecommendation controllers

CartRecommendationsList
Context
DictionaryFieldContext
FrequentlyBoughtTogetherList
FrequentlyViewedDifferentCategoryList
FrequentlyViewedSameCategoryList
FrequentlyViewedTogetherList
PopularBoughtRecommendationsList
PopularViewedRecommendationsList
UserInterestRecommendationsList

ProductRecommendation actions

ClickAnalytics
Configuration
Context
DictionaryFieldContext
ProductRecommendations
SearchHub

CaseAssist engine

CaseAssist controllers

CaseAssistInteractiveResult
CaseAssistQuickview
CaseField
CaseInput
DocumentSuggestionList

CaseAssist actions

CaseAssistAnalytics
CaseField
CaseInput
DocumentSuggestion
GenericAnalytics

Insight engine

Insight controllers

AttachToCase
BreadcrumbManager
CategoryFacet
DateFacet
DateFilter
DidYouMean
Facet
FacetConditionsManager
FacetManager
FoldedResultList
InsightInterface
InteractiveResult
NumericFacet
NumericFilter
Pager
QueryError
QuerySummary
Quickview
ResultList
ResultsPerPage
SearchBox
SearchParameterManager
SearchStatus
SmartSnippet
SmartSnippetQuestionsList
Sort
Tab

Insight actions

AttachedResults
CaseContext
DateFacetSet
Field
GenericAnalytics
InsightAnalytics
InsightInterface
InsightSearch
InsightSearchAnalytics
NumericFacetSet
QuerySet
RecentResults

SSR Search engine

SSR Search controllers

Commerce engine

Commerce controllers

Cart
Context
FieldSuggestionsGenerator
InstantProducts
NotifyTrigger
ProductListing

RegularFacet
DateRangeFacet
NumericFacet
CategoryFacet

ProductTemplatesManager
ProductView
QueryTrigger
RecentQueriesList
Recommendations
RedirectionTrigger
Search

RegularFacet
DateRangeFacet
NumericFacet
CategoryFacet

SearchBox
StandaloneSearchBox

Commerce actions

CategoryFacetSet
Configuration
Context
CoreFacet
DateFacet
InstantProducts
NumericFacet
Pagination
Product
ProductListing
ProductListingParameters
Query
QuerySuggest
RecentQueries
Recommendations
RegularFacet
Search
SearchParameters
Sort
StandaloneSearchBoxSet

Product lifecycle
Change log
Versioned documentation

Headless library

Usage

Use result templates
Use a standalone search box
Implement highlighting
Usage Analytics

Leverage the Coveo UA library

Extend controllers
Synchronize search parameters with the URL
Use dependent facets
Modify requests and responses

Upgrading from v0 to v1
Code samples
Reference

Search engine

Search controllers

BreadcrumbManager
CategoryFacet
CategoryFieldSuggestions
Context
DateFacet

RelativeDateFormat

Search actions

AdvancedSearchQuery
Breadcrumb
CategoryFacetSet
ClickAnalytics
Configuration
Context
DateFacetSet
Debug
DictionaryFieldContext
DidYouMean
FacetOptions
FacetSet
Field
Folding
GenericAnalytics
History
NumericFacetSet
Pagination
Pipeline
Query
QuerySet
QuerySuggest
QuestionAnswering
Search
SearchAnalytics
SearchConfiguration
SearchHub
SortCriteria
StandaloneSearchBoxSet
StaticFilterSet

Recommendation engine

Recommendation controllers

Context
DictionaryFieldContext
RecommendationList

Recommendation actions

AdvancedSearchQuery
ClickAnalytics
Configuration
Context
Debug
DictionaryFieldContext
Field
Pipeline
Recommendation
SearchHub

ProductRecommendation engine

ProductRecommendation controllers

Context
DictionaryFieldContext

ProductRecommendation actions

Configuration
Context
DictionaryFieldContext
ProductRecommendations
SearchHub

CaseAssist engine

CaseAssist controllers

CaseAssistQuickview
CaseField
CaseInput
DocumentSuggestionList

CaseAssist actions

CaseAssistAnalytics
CaseField
CaseInput
DocumentSuggestion

Insight engine

Insight controllers

BreadcrumbManager
CategoryFacet
DateFacet
DateFilter
DidYouMean
Facet
FacetManager
InsightInterface
NumericFacet
NumericFilter
Pager
QuerySummary
Quickview
ResultList
ResultsPerPage
SearchBox
SearchParameterManager
SearchStatus
Sort
Tab

Insight actions

CaseContext
InsightAnalytics
InsightInterface
InsightSearch
InsightSearchAnalytics
NumericFacetSet

Product lifecycle
Versioned documentation

JavaScript Search Framework (legacy)

Migration planning

Overview and approaches

Atomic and Headless
Quantic

Value of migrating

Headless
Atomic
Quantic

Self-guided migration playbook

Installation

Get started
CDN links
Download
Upgrade

Version 1.x to 2.x Breaking Changes and Upgrade Guidelines
Version 0.9 to 1.0 Breaking Changes and Upgrade Guidelines

Core concepts

Components

Interact with the framework and its components
Lazy versus eager component loading
jQuery extension

Events
Endpoints
Result layouts
Result templates

Use custom icons
Use custom helpers

Usage Analytics
State

Guides

General customization tips

Create custom components

Implement a custom component in JavaScript
Display a Lithium thread that has a solution
Add a custom dropdown menu to a Searchbox

Apply complex customization using a component manager
Use standard form controls
Styling

Common use cases

Provide search box suggestions
Create a Standalone search box
Folding results

Folding fields
Use many folding components
Example

Change the language of your search interface
Add ARIA landmarks
Send custom context information
Use dynamic facets
Use hierarchical facets
Normalize facet value captions
Request specific facet range values
Define dependent facets
Change the behavior when a result link is clicked
Validate an interface is machine learning ready
Add promoted results badges
Query a Product Recommendation model with JSUI
Display Smart Snippets

Advanced use cases

Display content based on whether there are query results
Add query ranking expressions at query time
Provide suggestions for the Omnibox
Leverage geolocalization
Use components only on specific tabs
Integrate a recommendation interface
Modify network calls
Add the settings component to a search interface

Advanced search component
Export to Excel component
Preferences Panel component
Share Query component

Log search page usage analytics data to Google Universal Analytics

Troubleshooting

Use the debug panel
Supported browsers
Use two versions of jQuery in the same page
Identify your version
Enable debug information in the REST queries
Use the relevance inspector
Prevent queries without keywords
Why are result counts inaccurate with folding enabled?
Why are some child items not folded?
Prevent tab captions from being cut off

Reference
Release notes

2025 releases

2024 releases
2023 releases
2022 releases
2021 releases
2020 releases
2019 releases
2018 releases
2017 releases

Interface Editor

2022 releases
2021 releases
2020 releases
2019 releases

Track usage analytics

Event Protocol

Migrate to Event Protocol
Relay library

Usage

Use Relay in Google Tag Manager

Upgrade

v1 to v2

Reference
Versioned documentation

Relay library

Usage

Use Relay in Google Tag Manager

Upgrade

v1 to v2

Reference
Versioned documentation

Coveo Explorer
Managing client IDs with server-side rendering
Event Protocol Reference

Leverage the Coveo analytics library

About the search hub
REST APIs

Standard actions and UA reference
Implement a search box
Implement a result list
Implement facets
Implement tabs
Implement an authentication method
Render static content
Search API

Perform a simple query
Perform a query

Group By operations
Query functions
Ranking functions
Result folding

Query security basics
Authentication methods

API key
Search token
Claims
SAML

Get query suggestions
Use field aliases
No syntax block
Get recommendations
Query extension language

Basics
Standard query extensions
Anatomy of a complex query using extensions
Samples

Search alert limitations
Troubleshoot query error codes
Use the Passage Retrieval API
Passage Retrieval API: Upgrade from alpha to v3
Version differences

Usage Analytics Write API

Log usage analytics events

Log search events
Log click events
Log custom events
Log view events
Log collect events

Troubleshoot Usage Analytics Write API error codes

Coveo In-Product Experience (IPX)
External search engine exclusions

Tune relevance
Monitor and measure your data
Leverage AI and ML
Manage an organization
Manage customer service solutions
Knowledge Hub
Coveo CLI
Coveo REST APIs
Searching with Coveo

Solutions and integrations

Coveo for Adobe
Coveo for Agentforce
Coveo for Commerce
Coveo for Contentful
Coveo for Optimizely
Coveo In-Product Experience (IPX)
Coveo for Salesforce
Coveo for ServiceNow
Coveo for Sitecore
Coveo for Zendesk

Security
Compliance
Services
Product entitlements
Coveo product news
Deprecations
Supported browsers
Glossary
Log in to Coveo for the first time

Coveo Platform

Build a search UI

JavaScript Search Framework (legacy)

Guides

How-to guides

How-to guides

This is for:

Developer

This section contains guides explaining how to achieve specific goals with the Coveo JavaScript Search Framework.

Browse the following how-to guides:

General customization tips
Common use cases
Advanced use cases
Log search page usage analytics data to Google Universal Analytics

Is this article useful?

You can close this window or leave a comment below.

Can you tell us more about your experience today?

Comments (optional)

Leave your email address if you'd like us to get back to you.

Email (optional)

Please provide a valid email address.

The Coveo Privacy Policy applies.

Need help with our product? Please open a support case for expert assistance. Use this feedback option to comment on the article only.

Is this article useful?

You can close this window or leave a comment below.

Can you tell us more about your experience today?

Comments (optional)

Leave your email address if you'd like us to get back to you.

Email (optional)

Please provide a valid email address.

The Coveo Privacy Policy applies.

Need help with our product? Please open a support case for expert assistance. Use this feedback option to comment on the article only.

Make every experience relevant with Coveo

Contact us Get a free trial

View as Markdown

View as Markdown
Open in ChatGPT
Open in Claude

In this article