Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt

Use this file to discover all available pages before exploring further.

The Layers panel shows the full structure of your page in a clear, tree-style view.
It helps you understand how everything is organized and makes it easier to select, manage, and rearrange elements.

​
Where to Find It

  1. Open your page in the editor
  2. Click the Layers icon on the left sidebar

​
What You See

  • A hierarchical (tree) structure of your page
  • Sections, containers, and elements nested inside each other
  • Each item represents a block on your canvas
Example:
  • Wrapper
    • Section
      • Container
        • Text
        • Image
        • Button

​
What You Can Do

​
Select Elements Easily

Click any item in the Layers panel to instantly select it on the canvas.

​
Understand Structure

See how elements are grouped:
  • Which items are inside containers
  • How sections are built
  • Where elements belong

​
Reorder Elements

You can drag and reorder elements within the same parent. For example:
  • Move a button above a text inside the same container
  • Reorder items inside a section

​
Important Limitation

You cannot move elements between different parents from the Layers panel.
  • You can reorder inside the same container
  • But you cannot drag an element from one container/section into another

​
Why It’s Useful

  • Quickly find hidden or hard-to-click elements
  • Keep your layout organized
  • Fix structure issues easily
  • Work faster on complex pages

​
Tree Navigation

The Tree Navigation (often displayed as a breadcrumb trail at the bottom of the editor) is a critical feature in the visual editor that helps you select and navigate between the different nested elements that make up your landing page layout. This is essential because modern layouts rely on placing elements inside other containers (like Sections, Boxes, or Columns).

​
How the Tree Navigation Works

The navigation appears as a horizontal list of element names at the bottom of the editor canvas, showing the current element you have selected and all of its parent containers, starting from the broadest element (like the Section) down to the most specific element (like Text or Image).

​
Key Uses of Tree Navigation

​
1. Selecting Parent Containers

When working with elements inside a Horizontal Box or Vertical Box, it can be difficult to select the container itself just by clicking on the canvas. The Tree Navigation makes this easy.

​
2. Identifying Nesting and Structure

The trail provides an immediate visual map of your page structure.

​
3. Quick Component Jumps

The navigation allows you to quickly jump between nested components without having to precisely click tiny elements on the live canvas.