---
title: Insert custom components in an existing search interface
slug: '2340'
canonical_url: https://docs.coveo.com/en/2340/
collection: coveo-for-sitecore-v5
source_format: adoc
---
# Insert custom components in an existing search interface

> **Legacy feature**
>
> The Coveo Hive Framework is now in maintenance mode and is no longer recommended for new implementations.
>
> To build new search experiences, use one of Coveo's more modern, lightweight, and responsive libraries.
> To get started, see the [Build search](https://docs.coveo.com/en/2473.md) article.

There are two ways to insert your own components into an existing search interface:

* [by adding a **Placeholder Section** rendering](#inserting-a-placeholder-section)
* [by patching the allowed controls of an existing placeholder](#patching-the-allowed-controls-of-an-existing-placeholder)

## Inserting a placeholder section

The **Placeholder Section** rendering allows adding a placeholder in the interface.
This placeholder can be an existing one that already has been configured or a custom placeholder.

Many of the placeholders in the Coveo **Modular Frame** already let you add the **Placeholder Section** rendering.

1. Select the **Main Content** section, and click **Add To Here**
2. Select the **Placeholder Section** component.

   ![Screenshot of the Sitecore Select a Rendering window with the Placeholder Section rendering selected | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553669.png)

1. Select or create a new data source.
If you select an existing data source that's already configured,  jump to step 7.
1. You should now have a non-configured **Placeholder Section** component.

   ![Screenshot of the Sitecore Experience Editor showing the Placeholder Section component with a message prompting user to edit its component properties | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553666.png)

1. Click the component, and click **Edit Coveo Data Source**.
2. Enter the placeholder key that you want to insert.

   ![Screenshot showing the data source Placeholder Key field value set to My Placeholder | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553667.png)

1. You should now have an empty placeholder.
If you don't see it, ensure that you have properly configured the **Placeholder Settings** for the key entered in the data source.
+
![Screenshot of Sitecore Experience Editor showing the empty placeholder of the Placeholder Section component | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553668.png)

## Patching the allowed controls of an existing placeholder

This item allows you to add your own Allowed Controls to a placeholder without running the risk getting your placeholder overwritten during an upgrade.

You should always use this method to patch the placeholders provided by Coveo for Sitecore.

1. In the **Content Editor**, in the location of your choice.
 .. For example, create a folder named "My Placeholder Extenders" under the path **Sitecore** > **Layout**> **Placeholder Settings.**.

       ![Screenshot of the Sitecore content tree showing a My Placeholder Extenders folder in the Placeholder Settings folder | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553671.png)
1. Right-click the folder and choose **Insert** > **Insert From Template**
2. In the templates, navigate to **Coveo Hive** > **Structure** and choose **Placeholder Extender**.
 .. Choose a name that identifies what you're extending.

       ![Screenshot of the Sitecore Insert from Template window showing the user setting the value of the new Placeholder Extender item | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/select-place-holder-extender-template.png)
1. In your newly created item, select the **Placeholder Setting** property.
2. Choose the placeholder that you want to extend.

   ![Screenshot of the item Placeholder setting dropdown with the Placeholder Settings Coveo Hive Facets item selected](https://docs.coveo.com/en/assets/images/c4sc-v5/placeholder-to-extend-key.png)

1. In the **Allowed Controls** property, click **Edit**.
2. Choose the controls that you want to add and click **OK**.
 .. In this example, we add **Coveo Pager** to the coveo**-facets** placeholder.
This allows us to add the Pager component where the Facets are usually located.
+
![Screenshot of the Sitecore Select Items window with the Coveo Pager item added to the Selected pane | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553674.png)
1. Save the item.
2. You should now be able to add the component from the extender to the provided placeholder.

   ![Screenshot of the Sitecore Select a Rendering window showing the Coveo Pager component selected | Coveo](https://docs.coveo.com/en/assets/images/c4sc-v5/37553675.png)