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 .
-
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.
- Optional:
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.