Layers Tree

what is the layers tree? the layers tree is a panel located in the layers sidebar (left side of the creation engine) that displays the page structure in a parent–child hierarchy every element added to a page appears here, indented to reflect its nesting and relationship to other elements it helps you understand what elements exist on the page how elements are nested which elements are visible or hidden the type of each element (heading, form, div, button, label, input, etc ) how the layers tree is organized panel structure the layers tree panel contains panel header displays the title “layers” with a collapse button to show or hide the sidebar layers list a hierarchical list of all elements present on the page no search, filtering, or reordering functionality is available in the layers tree hierarchy display elements are shown in a nested tree format top level elements appear without indentation child elements are indented beneath their parent expand / collapse arrows (▼ / ►) appear for elements that contain children example structure h1 form ├─ div │ ├─ h2 │ ├─ div │ │ ├─ label │ │ └─ input │ └─ div │ ├─ label │ └─ textarea indentation visually represents how elements are grouped and nested core features of the layers tree 1\ select elements from the layers tree description clicking an element in the layers tree selects it on the canvas behavior the selected element is highlighted on the canvas the component editor displays that element’s properties use case helps select elements that are difficult to click directly on the canvas 2\ expand and collapse parent elements description expand or collapse parent elements to show or hide their children within the layers tree only behavior does not affect canvas visibility only controls tree readability 3\ hide and show elements (eye icon) description temporarily toggle element visibility on the canvas behavior 👁 visible 👁‍🗨 hidden but retained in the tree use case useful for temporarily removing elements from view without deleting them 4\ delete elements (× icon) description permanently removes an element and its children important this action is irreversible unless undo is used immediately actions available in the layers tree action access purpose select click element name select element on canvas expand / collapse ▼ / ► show or hide children hide / show 👁 toggle visibility delete × remove element permanently summary the layers tree provides a read only structural view of page elements with support for selection visibility control expansion and collapse deletion it does not support searching, filtering, or reordering all changes above strictly reflect current, supported behavior only