Back to Glossary
UI Components

Layer Panel

The Layer Panel shows the stacking order and visibility of every block in the current scene. It is the standard surface for managing complex compositions: select hidden blocks, drag to reorder, toggle visibility per element, lock blocks to prevent accidental edits.

The panel maps directly to CE.SDK’s parent-child block hierarchy. The scene is the root; pages are direct children; blocks live under pages; groups create additional nesting. The Layer Panel exposes this tree visually, with groups as collapsible parent nodes and reordering operations equivalent to changing a block’s position in the hierarchy.

When the Layer Panel matters

The Layer Panel becomes valuable in compositions where blocks overlap or extend beyond the visible canvas: marketing banners with stacked text and image blocks, multi-page documents with shared elements, print layouts with locked backgrounds and several editable layers on top.

Without the Layer Panel, selecting a specific element in a crowded composition requires precise clicking, often with multiple attempts to navigate through stacked elements. With it, any block in the scene is one click away regardless of what is covering it.

What the Layer Panel offers

  • Full block list showing every element in stacking order, from front to back. Groups appear as collapsible nodes with their children indented.
  • Visibility toggle to show or hide individual blocks without deleting them. Useful for previewing the design with and without specific elements.
  • Drag-to-reorder which is equivalent to bring-to-front and send-to-back operations performed from the canvas.
  • Direct selection by clicking the block in the list. This is the main reason the Layer Panel exists: it solves the “I cannot click that block on the canvas because something is on top of it” problem.
  • Lock and unlock to prevent specific blocks from being selected or moved during editing. Useful for anchoring backgrounds while the user focuses on foreground content.

The hide decision

The Layer Panel is shown by default in the Design Editor. Most integrations make a deliberate choice about whether to keep it visible.

  • In Creator-facing tools, the Layer Panel stays visible. Template authors building complex compositions need direct access to every block, including locked ones, to set up scopes and constraints.
  • In Adopter-facing tools, the Layer Panel is almost always hidden. The Adopter should not see (or be tempted to manipulate) the locked blocks that make up the template structure. Hiding the Layer Panel keeps their attention on the editable content the Creator surfaced.

The Layer Panel is configurable per integration: shown, hidden, or repositioned. The decision is usually consistent with the role the editor session runs in.

Where the Layer Panel does not appear

Layer Panel is a Design Editor surface. The Video Editor uses the Timeline as its primary organizational axis instead. Video clips and overlays are arranged by time and track, not by depth-of-canvas stacking. The Layer Panel is not part of the Video Editor Starter Kit by default.

See block-hierarchy for the underlying tree structure the Layer Panel visualizes, and timeline for the temporal equivalent in the Video Editor.