---
title: "Add an external component"
slug: "add-an-external-component"
abstract: "How to add an external component to a page."
---
# Add an external component

> [!note]
> To configure Content Hub, you must either be a superuser or have the necessary permissions granted to you through [user group policies](https://doc.sitecore.com/ch/en/users/content-hub/user-group-policies.html "User group policies").

**External** components let you integrate external libraries into Sitecore Content Hub.

> [!important]
> An **External** page component can handle one JavaScript (JS) bundle only. The bundle is a single file containing both code and template.
>
> External page components, including the structure of HTML elements, might be affected by system upgrades. Changes might not persist, and unexpected behavior might occur. Exercise caution and review customizations after updates. Follow [best practices](https://doc.sitecore.com/ch/en/developers/cloud-dev/css-classes-and-attributes.html) when developing custom code.

> [!note]
> **Before you begin**
> -   [Upload the JS bundle](https://doc.sitecore.com/ch/en/users/content-hub/upload-a-javascript-bundle.html "Upload a JavaScript bundle").

To add an external component:

1. On the menu bar, click **Manage** :mdiCogOutline:.
2. On the **Manage** page, click **Pages**.
3. On the **Pages** page, select the page you want to modify.
4. On the **Layout** tab, [add the page component](https://doc.sitecore.com/ch/en/users/content-hub/add,-modify,-or-delete-page-components.md "Add, modify, or delete page components").
5. Click the component to open its details page.
6. Do one of the following:
    - If you uploaded the JS bundle to a CDN, select the **From path** option, and enter the full URL of the external JS bundle.
    - If you uploaded the JS bundle to Content Hub as a portal asset, select the **From asset** option, click **Add** :mdiPlus: and, in the **Asset** dialog, select the JS bundle portal asset, and then click **Save**.
7. In the **Configuration** section, [add custom JSON](https://doc.sitecore.com/ch/en/users/content-hub/add-custom-json.html "Add custom JSON") to show property information, use renditions, check permissions, and render content as needed.
8. To reuse an old Knockout fallback component, search for it in the **Knockout fallback component** search box.

    > [!tip]
    > You might want to reuse older customized Knockout components on pages that were migrated to React but are rendered in Knockout to preserve customizations.

9. Click **Save and close**.