Integrating Coveo Components in a Lightning Community

Coveo for Salesforce comes with the Community Search page and case deflection Lightning components, which can be dragged and dropped in your community. You can then use the Coveo Interface Editor to customize the components. It also comes with the Standalone Searchbox and a Page View Tracker component.

You should duplicate the Coveo components instead of using the default ones (see Integrating the Coveo Components in a Custom Lightning Component).

This page shows you how to add the default Coveo Lightning components to your community with the Community Builder.

Accessing the Salesforce Community Builder

  1. Make sure Salesforce communities are enabled for your organization (see Enable Salesforce Communities).

    When creating a community, the only supported template is Customer Service.

  2. Give the View Global Header permission to internal users who need access to the community to allow them to see the global menu (see Enable the Global Header for Communities).

  3. Access the Community Builder:

    1. In Setup, search for and select All Communities.

      With Salesforce Lightning With Salesforce Classic
      Under Platform Tools, select Feature Settings > Communities > All Communities. Under Build, select Customize > Communities > All Communities.
    2. Next to your community, select Community Workspaces.

    3. In the new tab, under My Workspaces, select Builder.

  4. In the Salesforce Community Builder, you can add many components.

Adding a Coveo Community Search Component

  1. Access the Salesforce Community Builder.

  2. In the left sidebar, click Components.

  3. In the Components dialog, under Custom Components, drag the Coveo Community Search component and drop it onto the page region where you want the search interface to appear, typically in the Content section.

  4. When you create a Community Search component for the first time, the Interface Creator (This search page isn’t configured yet. dialog) appears:

    1. Click the Community Builder Preview button in the upper-right section of the page to switch to preview mode.

      Coveo for Salesforce 3.25 (February 2019)

      In a newly created community, you must either publish your community and create or edit your search page via the published community URL, or to continue in Preview mode, you must add the following Content Security Policy (CSP) Trusted Sites (see Content Security Policy Overview):

      • https://<YOUR_ORG_URL>

      • https://<YOUR_ORG_URL>

      After adding these sites, you must refresh the page to use the Interface Creator. You should also set the CSP security to Allow Inline Scripts and Script Access to Any Third-Party Host.

    2. In the Coveo Search component region, click Set up a Search Page.

    3. Follow the onscreen steps, and then click Create page.

      If an error message appears after clicking Create page, you must add missing Content Security Policy Trusted Sites to your Salesforce organization.

    You should now have a functional search page connected to the Salesforce search box, returning results from your Coveo organization index. You can also test your search page.

  5. When you’re satisfied with your search page, in the Community Builder top corner, click Publish to make your changes available to your community users (see Publish Your Customizations with Community Builder).

    Be aware that publishing Interface Editor changes immediately affects your community page in production.

  6. Make sure that the appropriate users are members of your community so that they can see your search page (see Add Members to Your Community).


Adding a Coveo Case Deflection Component

Pro and Enterprise editions only

Coveo for Salesforce 3.29 (March 2019)

You can add the Coveo Case Deflection component in your Lightning Community to provide recommended solutions to users before they submit a case to your Support Agents (see Integrating a Coveo Case Deflection Component in a Lightning Community).

Coveo for Salesforce 2.41+ (May 2017)

You can use the Coveo Community Searchbox component to add a standalone search box in your Salesforce Lightning Community (see Creating a Standalone Searchbox). To include the Coveo Community Searchbox in your Salesforce Lightning community, follow the steps below:

  1. Access the Community Builder of your community; and then, in the menu on the left, select Theme.


  2. Click Theme Settings.

  3. Under Search Component, in the drop-down menu, select Coveo Community Searchbox.

    If you’re using a previous version, the component name will be:

    • Before 2.51: Searchbox

    • Before 3.25: Coveo Searchbox

  4. Close the Settings menu.

Your search page now uses the Coveo Standalone Searchbox.

Additional Considerations

  • Due to a difference in the Salesforce Winter ‘18, you must make sure that you have the appropriate value for the Search Url option (see Customizing the Standalone Searchbox):

    • Before Winter ‘18: search/all/home/%40uri

    • Winter ‘18 and up: global-search/%40uri

  • When you have the default Headline component from Salesforce integrated into your community search page, you won’t notice that it always shows the query is @uri. You’re encouraged to remove this component, as it’s incompatible with the Standalone Searchbox.


  • With your current configuration, both the standalone searchbox and the search component are injecting their query to the search component. Since the search component query isn’t changed by the search box, it simply queries @uri, which returns all results. The results are then further filtered by the query from the standalone searchbox. Leaving both query injections usually doesn’t cause any problems. If you prefer to only inject the relevant query, you can disable the Auto inject basic query setting of your search component.

  • The Coveo Standalone Searchbox doesn’t support Community Branding (see Brand Your Community). However, using custom CSS to override the template elements should still work as expected (see Override Template Elements with Custom CSS).

  • Coveo for Salesforce 2.50 (December 2017) In the Interface Editor settings, you need to enable theme layouts when integrating the standalone searchbox by enabling history on your search page.

    Coveo for Salesforce 2.51 (February 2018) Using many theme layouts with the Standalone Searchbox is supported.

You can now customize your Standalone Searchbox by using the options panel (see Customizing the Standalone Searchbox).

Inserting the Coveo Page View Tracker Component

Coveo for Salesforce 3 (May 2018)

The Coveo Page View Tracker component can be inserted in your Lightning community to send usage analytics data to Coveo Cloud. While it doesn’t serve a specific purpose at the moment, the data gathered by the component will later be used to recommend pages to your users.

  1. In Salesforce, access the Community Builder of your community (see Navigate Community Builder).

  2. In the menu on the left, select the Lightning icon to see the list of components.

  3. Under Custom Components, drag the Coveo Page View Tracker component, and drop it in the header of your page.

    It’s generally recommended to have the Coveo Page View Tracker on every page of your community so all of your page view are recorded. Dropping the component in the header of the page allows you to quickly and easily achieve this.

Adding Missing Content Security Policy Trusted Sites

Following changes in the Salesforce framing policies, you may need to manually add URIs to your Content Security Policy (CSP) Trusted Sites to access the Interface Creator and Interface Editor.

To know which URIs to add to your CSP trusted sites

  1. In the Can’t Access Resources error message that appears after clicking Create page in the Interface Creator, copy the URI address displayed next to Blocked URI, and then add the URI to your CSP Trusted Sites.


  2. Back in the Preview mode of the Community Builder, open your browser developer tools, and then access the Console tab.

  3. In the Coveo Search component region, click Set up a Search Page, and then follow the onscreen steps.

  4. Click Create page and then, in the Console tab of your browser developer tools, you should see an error message.

  5. In the error message, copy the last URI that appears (the one displayed in red), and then add the URI to your CSP Trusted Sites.


After adding these sites, you must refresh the page to use the Interface Creator.

What’s Next?

Recommended Articles