THIS IS ARCHIVED DOCUMENTATION

Coveo for Sitecore Legacy Search UI Framework - Duplicating the Coveo Search Component

This is for:

Developer System Administrator

Coveo for Sitecore 4.1 (November 2018)

Before you modify a Coveo Search component, it’s highly recommended to duplicate it. This way, you can work on your copy while keeping the original component intact for more use and reference. This approach also enables you to work with many different versions of the same component. Here are the required steps - along with best practices - to duplicate a component.

  1. From the Sitecore Content Editor, create a new folder named Custom under /sitecore/Layout/Sublayouts.

  2. Duplicate the Coveo Search sublayout (right-click > Duplicate).

  3. Name it Custom Coveo Search.

  4. Move it to the Custom folder that you have just created.

  5. In your new sublayout (/sitecore/Layout/Sublayouts/Custom/Custom Coveo Search), change the value of the Ascx file field so that it points to /layouts/Custom/CustomCoveoSearch.ascx.

    Note that CustomCoveoSearch.ascx doesn’t exist yet. It will be created in the upcoming steps.

  6. On the Sitecore server, locate the physical folder located at <your sitecore instance folder>\Website\layouts.

  7. In it, create a new folder named Custom.

  8. Copy the file \Website\layouts\Coveo\CoveoSearch.ascx to \Website\layouts\Custom\CustomCoveoSearch.ascx.

  9. From the Sitecore Content Editor, create a new Coveo-Powered Search Page under /sitecore/Content/Home if you don’t already have one (right-click > Insert > Coveo-Powered Search Page).

  10. Access the Layout Details dialog of your Coveo-Powered Search Page item (Presentation > Details).

  11. For the Default device, select Edit in the list of controls.

  12. In the Device Editor dialog, under Controls, select the Coveo Search control and choose Change.

  13. In the Select a Rendering dialog, select your duplicated sublayout (/Sublayouts/Custom/Custom Coveo Search) and choose Select.

  14. In the Device Editor dialog, choose OK.

  15. In the Layout Details dialog, choose OK.

  16. Save your Coveo-Powered Search Page item.

  17. Validate that your Coveo-Powered Search Page now displays your new Coveo Search sublayout/component (Publish > Preview).

    Visually, unless you customize the Custom Coveo Search component, your Coveo-Powered Search Page will look exactly the same as before. It would be a good idea to display some custom string to validate that your new component is indeed displayed as expected. For example, you may add a simple HTML paragraph as such:

    <p>Hello world!</p>

    The result should look like this: