JavaScript Search Legacy Interface Editor Overview

The Interface Editor allows administrators and developers to easily customize a Coveo JavaScript Search page that is integrated in a Salesforce page.

Coveo for Salesforce 2.26 - July 2016  A newer Coveo JavaScript Search Interface Editor replaces the legacy Interface Editor described in this topic (see JavaScript Search Interface Editor).

The Interface Editor appears in a side panel on the right of the search interface (see Accessing the Coveo Legacy Interface Editor in Salesforce).

The Interface Editor with a full search page in the basic mode.


1 Search interface Tab components
2 Search interface Facet component
3 Search interface Result list component
4 Search interface Sort components
5 Interface Editor

Interface Editor Modes

The Interface Editor by default presents common search interface customization features that can be used by anyone. Administrators can use the default Interface Editor mode to easily customize the layout of a search page by adding, removing, or moving visible components and customize basic parameters of these components.

The Interface Editor also offers an Advanced Mode allowing developers or tech-savvy administrators to easily perform more complex customization without having to play with the HTML code. Developers and administrators can use the Advanced Mode to add, remove, or move any visible or hidden component and customize any of their parameters. You may need developer skills to understand and correctly configure many of the advanced parameters.

Hidden component such as suggestions or results templates have no direct user interface elements, but are still contributing to the behavior of your search page.

Under the hood, in both modes, the Interface Editor directly modifies the HTML code of the page. The Interface Editor can be used even when a developer directly customizes the search page code (see Getting Started with the JavaScript Search Framework).

Interface Editor features Interface Editor mode
Basic Advanced
Drag-and-drop components
Edit common components
(Tab, Facet, Sort, Result list)
View and edit common component parameters
Highlighted editable components
Manage Draft and Published versions
Automatic immediate save to draft
Parameter value suggestions
Immediate preview of parameter changes
View and edit all visible components
View and edit all hidden components
Edit all component parameters
View search page code