Inserting Coveo Search Components to an Existing Item Using the Coveo for Sitecore Legacy Search UI Framework

Coveo for Sitecore 4.1 (November 2018)

While you can use the provided Coveo layouts to host your Coveo-powered search page, you might prefer to integrate the Coveo search components in one of your existing layouts so that it keeps the same look and feel as the rest of your website.

To do so, follow these steps.

1. In the Content Editor, select the item you want to use as your search page.

   Duplicate an existing page.

2. In the Presentation tab, select Details.

3. Under Default, click Edit, opening the Device Editor window.

4. Select the Controls tab, and remove the component the Coveo search component will replace.

   Take note of its placeholder name. The placeholder name of a component is written under its name.

5. When adding Web Form components:

   1. Select Add.

   2. Navigate to Sublayouts > Coveo, and select Coveo Search Resources.

      1. In Add to Placeholder, enter the placeholder name of the previous component.
      2. Click Select.
   3. Select Add again.
   4. Navigate to Sublayouts > Coveo, and select Coveo Search.
      1. In Add to Placeholder, enter the placeholder name of the previous component.
      2. Click Select.
6. When adding MVC components:
   1. Select Add.
   2. Navigate to Renderings > Coveo, and select Coveo Search View Resources.
      1. In Add to Placeholder, enter the placeholder name of the previous component.
      2. Click Select.
   3. Select Add again.
   4. Navigate to Renderings > Coveo, and select Coveo Search View.
      1. In Add to Placeholder, enter the placeholder name of the previous component.
      2. Click Select.

7. Click OK to close the Device Editor window, and OK again to close the Layout Details window.

8. Save your item.
9. Test that your item behaves as expected by selecting the Publish tab and clicking Preview.