Pass Non-Fronted JavaScript Framework Properties to Hive Components

Warning
Legacy feature

This article pertains to the Coveo Hive framework which is now in maintenance mode.

Choose one of Coveo’s more modern, lightweight, and responsive libraries for any future search interface development. See the search interface Implementation guide for more details.

Coveo Hive framework renderings wrap Coveo JavaScript Search Framework components in Sitecore renderings. Editing Coveo for Sitecore rendering data source items lets you leverage many, but not all, Coveo JavaScript Search Framework component options.

The February 2019 version of Coveo for Sitecore added a new rendering data source feature called Additional Data Attributes on many Coveo Hive components. This feature lets you use the entire set of options on the related Coveo JavaScript Search Framework component without having to create all the resources associated with a Coveo Hive component (see Integrate a Custom Component in Sitecore Using the Coveo Hive Framework).

With this new feature, you can set any Coveo JavaScript Search Framework component option on its related Coveo Hive component by specifying key-value pairings in the Coveo for Sitecore rendering data source (see Coveo JavaScript Search Framework - Reference Documentation).

Example

You have added several tabs in your Coveo for Sitecore search interface. The default sorting order of the search results is set to relevancy. However, when a specific tab in your search interface is selected, you would like the search results to be sorted in date descending order, using the Coveo JavaScript Search Framework tab component sort option (see Tab Component - Sort).

To set the sorting order of search results for a specific tab

  1. In the Experience Editor, select the tab component to set the sort order on.

  2. On the floating toolbar, click Edit the rendering’s data source.

  3. Scroll to the Attributes section.

  4. Under Additional Data Field, specify the name of the Coveo JavaScript Search Framework component option in the key field and the required parameter value.

    AddtionalDataAttributes
  5. Save and publish your changes.

Notes
  • The Additional Data Attributes feature allows many key-value pairs to be configured on the data source.

  • Use camel case notation for multi-word Coveo JavaScript Search Framework attributes.

    For example, type tabNot in the Additional Data Attributes key field to reference the data-tab-not Coveo JavaScript Search Framework attribute.

    AddtionalDataAttributesMultiWordAttributes