> ## 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.

# Слои и структура страницы: панель Layers

> Панель Layers в редакторе LanderLab показывает дерево страницы: выбирайте и переставляйте элементы, используйте Tree Navigation.

Панель Layers показывает **полную структуру вашей страницы** в виде понятного дерева.<br />Она помогает понять, как всё устроено, и упрощает выбор, управление и перестановку элементов.

## Где это найти

1. Откройте страницу в редакторе
2. Нажмите на **иконку Layers** в левой боковой панели

## Что вы видите

* Иерархическую (древовидную) структуру вашей страницы
* Секции, контейнеры и элементы, вложенные друг в друга
* Каждый пункт соответствует блоку на холсте

Пример:

* Wrapper
  * Section
    * Container
      * Text
      * Image
      * Button

## Что можно делать

### Удобный выбор элементов

Нажмите на любой пункт в панели Layers, чтобы мгновенно выбрать его на холсте.

### Понимание структуры

Видно, как сгруппированы элементы:

* Какие пункты находятся внутри контейнеров
* Как устроены секции
* Куда относится каждый элемент

### Перестановка элементов

Элементы можно перетаскивать и менять их порядок **в пределах одного родителя**.

Например:

* Переместить кнопку выше текста внутри одного контейнера
* Изменить порядок элементов внутри секции

## Важное ограничение

Из панели Layers **нельзя перемещать элементы между разными родителями**.

* Менять порядок внутри одного контейнера можно
* Но перетащить элемент из одного контейнера или секции в другой нельзя

## Чем это полезно

* Быстро находить скрытые или труднодоступные для клика элементы
* Поддерживать порядок в макете
* Легко исправлять проблемы со структурой
* Быстрее работать со сложными страницами

## Tree Navigation

**Tree Navigation** (часто отображается в виде **хлебных крошек** внизу редактора) — важная функция визуального редактора, которая помогает выбирать и переключаться между вложенными элементами, из которых состоит макет лендинга.

Это нужно, потому что современные макеты строятся на размещении элементов *внутри* других контейнеров (Sections, Boxes, Columns).

### Как работает Tree Navigation

Навигация появляется в виде горизонтального списка названий элементов внизу холста. Она показывает выбранный в данный момент элемент и все его родительские контейнеры — от самого широкого (например, Section) до самого конкретного (например, Text или Image).

### Для чего нужна Tree Navigation

#### 1. Выбор родительских контейнеров

Когда вы работаете с элементами внутри Horizontal Box или Vertical Box, бывает сложно выбрать сам контейнер простым кликом по холсту. Tree Navigation делает это простым.

#### 2. Понимание вложенности и структуры

Цепочка даёт мгновенную визуальную карту структуры вашей страницы.

#### 3. Быстрые переходы между компонентами

Навигация позволяет быстро переключаться между вложенными компонентами, не пытаясь точно попасть кликом по мелким элементам на рабочем холсте.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.