External Components Section

Coveo for Sitecore Specific Rendering Section that allows registering components with a specific search interface in the page.

Usage Notes

Usage Notes

Insertion Location

The External Components Section rendering is an Allowed Control in no Coveo Hive placeholder.

Example insertion sequence for the External Components Section rendering.

Coveo for Sitecore SXA rendering insertion locations aren’t limited by placeholder Allowed Controls. The External Components Section rendering may therefore be inserted throughout the partial design, whether in Coveo for Sitecore or Sitecore placeholders.

Example insertion sequence for the External Components Section rendering.

Data Source Options

Option name Description
Search Interface The search interface on which to initialize the components

Sample Generated HTML and Use Case

You associate a Sitecore item with a .cshtml layout file derived from the Coveo Basic Search Interface Layout.cshtml file. In your custom layout file, you add a header section in which you include a placeholder configured to receive an External Components Section rendering.

In the Experience Editor, you insert an External Components Section rendering in your header section placeholder and embed a Coveo Global Searchbox within it. In the Coveo UI placeholder, you insert a Coveo Search Interface rendering and embed two Coveo Tab renderings and a Coveo Results List rendering. Finally, in the UI Resources placeholder, you insert the Coveo Search Resources rendering.

In the External Components Section data source, in the Search Interface field, you select the data source item of the previously added Coveo Search Interface rendering.

<div id="_35BA332A-2A9A-4D06-805A-A6A73AD478A2" data-search-interface-id="coveo902ed4d0">
<!-- Content of the External Components Section appears here -->
</div>
<script type="text/javascript">
    document.addEventListener("DOMContentLoaded", function() {
        var externalComponentsSection = document.getElementById("_35BA332A-2A9A-4D06-805A-A6A73AD478A2");
             CoveoForSitecore.initExternalComponentsSection(externalComponentsSection);
    });
</script>

Animation showing search behavior when using global search box in External Components Section

Animation showing Coveo Global Searchbox behavior when inserted in an External Components Section. Note that the linked search interface tab filtering is applied and only items based off the Cottages template are listed in search results.

Recommended Articles