Use elements to build components
In XM Cloud Components, components are built using elements, such as text blocks, buttons, cards, and sections, usually grouped together within block elements. This topic describes how to select elements when they are visually nested, as well as how to duplicate or delete an element.
Select an element
Sometimes an element can contain a child element that is the same size. This can make it difficult to select the specific element you want to work with. When you click the canvas of a component, the top-level element is selected.
To select a specific element on the canvas:
-
On the canvas, click the location where the element you want to select is. The top-level element is selected.
-
On the context toolbar at the bottom of the component, click
to open the children elements drop-down menu. -
Click the child element you want to select.
Duplicate an element
Elements can be duplicated or duplicated linked. When duplicated, the original element and the copy can be edited differently, independently from each other. Elements that are duplicated linked are shared between versions, and the linked duplicates cannot be edited or configured. However, any changes applied to the original element propagate instantly to all linked elements.
Sections and elements that are directly placed on a section's grid cannot be duplicated linked.
To duplicate an element:
-
Click the element you want to duplicate.
-
On the context bar, click Duplicate or Duplicate linked.
Duplicated elements appear below the original element, in the same component.
Duplicated blocks include all elements previously nested in the duplicated block, and appear near the initial block on the grid.
Duplicated blocks and elements can be moved to a new location within the component, or to another version of the component.
Delete an element
To delete an element:
-
Click the element you want to delete.
-
On the context bar, click Delete
.