Inserting and Customizing a Recommendations Component Using the Coveo for Sitecore Legacy Search UI Framework

Inserting and Customizing a Recommendations Component Using the Coveo for Sitecore Legacy Search UI Framework

This is for:

Developer System Administrator

Coveo for Sitecore (October 2016) Enterprise Cloud only Coveo for Sitecore (November 2018)

The Recommendations component displays items that may interest the most a user based on a comparison between the Coveo Machine Learning (Coveo ML) model and their current navigation pattern. You can integrate the component into any page as long as it includes the following resource:

• The Coveo Page View Analytics Component (see Logging View Events)

• The Coveo Search Resources

Adding the Coveo Page View Analytics Component and Coveo Search Resources

For your Recommendations component to work, you first need to include the Coveo Page View Analytics Component to your page.

1. Open the Sitecore Content Editor, and in the navigation tree, click your item.

2. In the Presentation tab, click Details:

   1. In the Layout Details window, under Default, select Edit.

   2. In the Controls tab, click Add.

   3. Add the Coveo Page View Analytics Component:

      1. For Web Form, the component is located under Sublayouts > Coveo, and is called Coveo Page View Analytics.

      2. For MVC, the component is located under Renderings > Coveo, and is called Coveo Page View Analytics View.

   4. In Add to Placeholder, enter the name of one of your placeholder.

      When adding it to a Coveo-Powered Search Page, enter the same name as the Coveo Search Resources or Coveo Search Resources View, which is coveo-search by default.

      Ensure that the Coveo Page View Analytics component is placed before the Coveo Search component.

   5. Click Select.

3. If you’re adding recommendations to a page that isn’t a search page, repeat step 2 to add the Coveo Search Resources (Web Forms) or the Coveo Search View Resources (MVC) component.

4. Click OK to close the Device Editor box, and OK again to close the Layout Details box.

Inserting a Recommendations Component in a Search Interface

1. Open the Sitecore Content Editor, and in the navigation tree, click your item.

2. Under the Publish tab, select the Experience Editor.

3. In the Experience Editor:

   1. Locate the coveo-recommendations placeholder (in the right section of the search interface) and click Add here.

      

   2. In the Select a Rendering window, click Coveo Recommendations, and then click Select.

      A CoveoSearch component must already be present on a page for a Coveo Recommendations to be able to be inserted.

4. In the Control Properties window, fill out at least the required properties:

   1. Title: Enter a title for your Recommendations component. This title is shown at the top of the box.

   2. Recommendations Pipeline: Enter the name of the pipeline containing the Coveo ML recommendation model.

      You should have created a pipeline specific to the recommendations module (see Getting Recommendations).

5. Click OK to save and close the dialog box.

6. Save and publish your page.

7. Validate that the recommendations component appears in your search interface.

   1. When in the Experience Editor, you should only see the header and no recommendations.

   2. When browsing your Sitecore website in incognito mode and have recommendations set and published, you should see recommendations after navigating the site and going to the search interface.

      

Inserting a Recommendations Component in an Existing Page

It’s also possible to use the Recommendations component directly on a page, without the Search Interface

1. Ensure that you have inserted the Coveo Page View Analytics and Coveo Search Resources components to your search page.

2. Ensure that you have a placeholder for your Coveo Recommendations component.

   1. In the Sitecore Content Editor, under the Presentation tab, click Details.

   2. In the Layout Details, under the Default section, click Edit.

      1. In the Device Editor dialog, in the Placeholder Settings tab, click Add.

      2. In the Select the Placeholder Settings:

         1. In the navigation tree, under Placeholder Settings > Coveo:

            1. If you’re using MVC: under MVC, click Coveo Recommendations MVC.

            2. If you’re using Webforms: under Web Forms, click Coveo Recommendations.

         2. Under Placeholder key, enter the same placeholder key you entered for your resources.

         3. Click OK to close the Select the Placeholder Settings dialog.

      3. Click OK to close the Device Editor dialog.

   3. Click OK to close the Layout Details dialog.

3. In the Sitecore Content Editor, select your item, and under the Publish tab, click Experience Editor.

4. In the Experience Editor:

   1. Locate and click the Recommendations placeholder, and click Add here.

   2. In the Select a Rendering dialog box:

      1. Click Coveo Recommendations.

      2. Click Select.

   3. In the Control Properties dialog box, fill out at least the mandatory fields:

      1. Title: Enter a title for your Recommendations component. This title is shown at the top of the box.

      2. Recommendations Pipeline: Enter the name of the pipeline containing the Coveo ML recommendation model.

   4. Click OK.

5. Save and publish your page.

6. Validate that the recommendations component appears in your search interface.

   1. When in the Experience Editor, you should only see the header and no recommendations.

   2. When browsing your Sitecore website in incognito mode and have recommendations set and published, you should see recommendations after navigating the site and going to the search interface.