Clone a component

task brazil Updated Sep 10, 2026 1 min read clone-comp.md

Clone a prebuilt component to create a custom version that can be tailored to specific needs, such as the modification of properties and underlying components.

Before you begin

Beginning with the Zurich release, Component UI Builder is enabled by default in your instance. Existing customers on release versions before Zurich release, you must enable Component UI Builder in your instance to clone a component. Make sure you’re referring UI Builder version 27.2 or above for cloning component.

Role required: sn_embeddable_core.emb_admin

Procedure

Navigate to All > Web Embeddables > Homepage.
In the Manage components section, select Action (⋮) on the component.
Select Clone.

Modify the following field values.

Field	Description
Name	Name of the custom component.
Component tag suffix	Enter a unique value to append to the prefix of component tag. It cannot be edited later.
Component tag	The tag used in the embed code helps identify the component.
Description	Description of the component.
Icon	Thumbnail image of the custom component.

Select Clone component.

The UI Builder application opens in a new browser tab in embeddable mode, where you can customize the component.
In a blank canvas, select Add content.

Note: Component palette displays components that are eligible to embed. Make sure the embed-ready category is selected.
Select the component.
Configure the component properties.
Select component from the other category.

Note: If you select any other category, make sure added component meets the criteria for embedding components on third-party websites.
Save the changes.
Select the Configure embeddable to navigate back to the Web Embeddables app homepage.

Result

The component is created and shown under the Manage components section on the Web Embeddables app home page and is identified by the Custom label.

68 lines · 2.7 KB Wrap lines

---
title: Clone a component
description: Clone a prebuilt component to create a custom version that can be tailored to specific needs, such as the modification of properties and underlying components.
locale: en-US
canonical_url: https://www.servicenow.com/docs/r/customer-service-management/customer-self-service-and-omnichannel-engagement/clone-comp.html
release: brazil
product: Customer Self-service and Omnichannel Engagement
classification: customer-self-service-and-omnichannel-engagement
topic_type: task
last_updated: "2026-09-10"
reading_time_minutes: 1
breadcrumb: [Update or create web components, Configure Web Embeddables, Set up self-service, Configure, Customer Service Management]
---

# Clone a component

Clone a prebuilt component to create a custom version that can be tailored to specific needs, such as the modification of properties and underlying components.

## Before you begin

Role required: sn\_embeddable\_core.emb\_admin

## Procedure

1. Navigate to **All** &gt; **Web Embeddables** &gt; **Homepage**.

2. In the Manage components section, select Action \(⋮\) on the component.

3. Select **Clone**.

4. Modify the following field values.

|Field|Description|
|-----|-----------|
|Name|Name of the custom component.|
|Component tag suffix|Enter a unique value to append to the prefix of component tag. It cannot be edited later.|
|Component tag|The tag used in the embed code helps identify the component.|
|Description|Description of the component.|
|Icon|Thumbnail image of the custom component.|

5. Select **Clone component**.

The UI Builder application opens in a new browser tab in embeddable mode, where you can customize the component.

6. In a blank canvas, select **Add content**.

**Note:** Component palette displays components that are eligible to embed. Make sure the embed-ready category is selected.

7. Select the component.

8. Configure the component properties.

9. Select component from the other category.

**Note:** If you select any other category, make sure added component meets the criteria for embedding components on third-party websites.

10. Save the changes.

11. Select the **Configure embeddable** to navigate back to the Web Embeddables app homepage.

## Result

The component is created and shown under the **Manage components** section on the Web Embeddables app home page and is identified by the **Custom** label.