Принцип построения сайта с помощью блоков
1. Сборка сайта из блоков
Страница сайта изначально пустая. Сайт собирается путём добавления блоков и расстановки их в нужном порядке. После сборки выполняются тонкие настройки: цвета, стили элементов, размеры шрифтов и наполнение контентом.
Все блоки имеют адаптивную структуру и корректно отображаются на мобильных устройствах.
2. Вход в режим визуального редактирования
В панели управления нажмите кнопку «Ред».
Откроется режим визуального редактирования.
3. Установка блока
В левой части экрана появляется кнопка с шестерёнкой.
Нажмите её — откроется панель выбора блоков.
При выборе блока появляется дополнительная панель для выбора стиля оформления.
Нажмите на нужный элемент и блок устаеновиться на страницу
Стили можно менять в настройках позже, панель предназначена для быстрой установки.
4. Управление блоком после установки
После установки блока на страницу - при наведении курсора на блок у блока отобразятся границы, выделенные синей рамкой и появится меню редактирования блока синего цвета.
У каждого блока свой набор кнопок управления, но есть похожие элементы, например:
 |
удаление блока |
 |
настройки блока, тут обычно можно задать размеры, отступы, цветовое оформление, поставить цвет, градиент или картинку фоном и другие настройки применительно к данному блоку. |
 |
копирование - блок с установленными стилями можно копировать не только на текущую страницу но и на другие страницы |
 |
перетащить блок - захватиете мышкой и тяните вверх или вниз, если отпустить иконку перетаскивания - блок установиться на новое место. Лайфхак - удобнее не перетаскивать блок, а схватить мышкой и удерживая на месте прокручивать страницу вверх вниз стрелочками на клавиатуре |
 |
стрелочки вверх / вниз - нажатие на стрелочку - приведёт к перемещению блока на одну позицию вверх или вниз. |
 |
Генерация контента блока с помощью искусственного интеллекта |
| другие функции |
5. Редактирование внутренних элементов
У некоторых блоков внутренние области могут выделяться зелёной рамкой с зелёной панелью иконок — меню действий с отдельным элементом.
Доступные действия:
-
Редактировать элемент
-
Переместить внутри блока
-
Удалить элемент
-
Другие функции
 |
редактировать элемент (текст) |
 |
переместить элемент внутри блока |
 |
удалить элемент |
| другие функции |
6. Сквозные блоки
Размещаются сразу на всех страницах сайта. Позиции заданы жёстко.
Примеры сквозных блоков:
-
Меню
-
Хлебные крошки (путь по сайту)
-
Подвал
-
Кнопка «Наверх»
-
Кнопка «Обратный звонок»
-
Соглашение об обработке cookies
7. Визуальный редактор
У многих блоков доступно редактирование через визуальный редактор.
При смещении курсора за пределы блока и клике содержимое сохраняется, редактор закрывается. Иконка с шестерёнкой временно меняет цвет на зелёный — подтверждение сохранения данных.
8. Свои блоки
Если недостаточно функциональости обчных блоков - Вы можете создать свой блок на HTML или PHP
При необходимости можете поправить общие стили сайта.
