Лендинги — конструктор сайтов

Модуль «Лендинги» — на сайте продукта

Визуальный конструктор публичных сайтов и посадочных страниц прямо в биллинге. Собирайте страницы из блоков или генерируйте через AI, публикуйте на поддомене с автоматическим SSL, а заявки падают лидами в CRM.

Что это

Модуль «Лендинги» (/admin/landing/) — конструктор корпоративных сайтов прямо в биллинге. Оператор собирает страницу из 23 блоков-секций (или генерирует целый сайт по описанию через AI), настраивает формы на воронки CRM и публикует на поддомене с автоматическим SSL. Уровень — полноценные корпоративные сайты, а не мини-лендинги.

• Раздел: «Лендинги» в меню (между CRM и Оборудование).
• Модуль: лицензируемый landing, тариф Pro+, категория «CRM и продажи».
• Kill-switch: LANDING_ENABLED — глобальный выключатель.

Возможности модуля одним взглядом:

# Лендинги
## Конструктор
- 23 блока-секции
- Drag-and-drop дерево
- Live-превью
- Выбор иконок и градиентов
## Hero и медиа
- Видео-фон desktop/mobile
- Фон-картинка cover/contain
- Оверлей затемнения
- Блок «Слайдер»
  - Автопрокрутка
  - Стрелки и точки
  - Фон desktop/mobile
## Эффекты
- Появление текста
  - fade / сдвиг / зум
  - размытие / раскрытие
  - печать
- Фон слайда
  - Ken Burns
  - зум / панорама
- Фон hero
  - частицы / волна частиц
  - лучи / duotone / параллакс
## AI
- Генерация сайта по описанию
- SEO / alt / rewrite / FAQ
## Публикация
- Поддомен организации
- Cloudflare + авто-SSL
- Мульти-орг
## Заявки
- Формы в воронки CRM
- Согласие ПД 152-ФЗ
## Аналитика
- Показы / заявки / конверсия
- UTM-метки

Блоки-секции (23 типа)

Страница собирается из блоков. Каждый рендерится безопасно (белый список + очистка HTML), без произвольного кода.

Блок тарифы подтягивает тарифы из биллинга (Tarif.show_crm, по организации). Блок проверка покрытия использует публичный /api/address/check/. Глобально — floating-nav (плавающее меню), переключатель тёмной темы, cookie-баннер.

Слайдер, медиа-фон и эффекты

Hero-секция может быть статичной, с видео/картинкой-фоном или полноценным слайдером — всё настраивается в конструкторе без кода.

Блок «Слайдер»

Отдельный блок hero_slider — несколько слайдов с автоматической прокруткой, стрелками и точками навигации. Каждый слайд содержит бейдж, заголовок, подзаголовок и кнопку.

При добавлении блока «Слайдер» подставляются 3 готовых фирменных слайда (интернет / умный дом / поддержка) с фонами из облака — их можно заменить своими.

Справа в инспекторе — все настройки слайдера: автопрокрутка и интервал, затемнение, высота, эффект появления текста, эффект фона (Ken Burns / зум / панорама) и список слайдов.

Медиа-фон hero

У обычного блока hero фон можно задать:

• Видео-фон — зацикленное видео без звука (loop, muted, autoplay), отдельно для десктопа и мобильного;
• Фоновое изображение — отдельно десктоп/мобильный, с настройками cover/contain, повтора и позиции;
• Оверлей затемнения — регулируемый слой поверх фона для читаемости текста;
• Градиент — визуальный редактор (два цвета + угол).

Загрузка медиа — прямо из конструктора; файлы хранятся в облаке (GCS). Рекомендуется предварительно оптимизировать: картинки — WebP, видео — MP4 (H.264, без звука).

Эффекты появления

Секции и слайды могут появляться с анимацией. Уважают системную настройку «уменьшить движение» (prefers-reduced-motion).

В блоке «Слайдер» эффект появления применяется к тексту активного слайда и перезапускается при каждом переключении.

Варианты раскладки секций

У девятнадцати секций есть выбор из трёх раскладок — одно и то же содержимое показывается по-разному, без правки шаблонов. Вариант выбирается эскизами в инспекторе (вкладка «Блок», сразу под кнопкой AI): раскладку видно, не примеряя каждую.

Редактор-конструктор

Трёхколоночный редактор:

• Слева — палитра блоков (drag-and-drop) + структура страницы (переупорядочить).
• Центр — live-превью (клик по блоку выделяет его в инспекторе) + переключатель устройств: компьютер / планшет / телефон.
• Справа — инспектор: вкладки «Блок» (свойства), «Сайт» (floating-nav, cookie, текст согласия ПД), «Тема» (цвет, тёмная тема), «SEO».

Панель публикации: Аналитика, Заявки, AI-помощник, Предпросмотр, Сохранить, Опубликовать. Кнопка сворачивания меню биллинга разворачивает редактор на весь экран.

Тема страницы

Вкладка «Тема» инспектора. В галерее показывается только тема организации, которой принадлежит страница — чужие фирменные стили в списке провоцировали выпустить страницу одной компании в цветах другой.

• Предпросмотр — иконка «глаз» на карточке темы показывает страницу в этой теме на своём содержимом, ничего не сохраняя.
• Своя тема — загрузите описание фирменного стиля файлом .md или укажите адрес существующего сайта: AI разберёт цвета, шрифты и скругления. Результат сначала показывается, применяется отдельной кнопкой.
• Тонкая настройка — акцентный цвет, тёмная тема, шрифты заголовков и текста, скругления, палитра, форма кнопок. Логотип и favicon берутся из брендинга организации.

Подобранные значения проходят через белый список: в теме могут быть только те варианты, что есть в селекторах редактора. Адрес сайта проверяется на приватные сети — запрос уходит с сервера биллинга, и без проверки так можно было бы прочитать внутренний адрес.

Фон секции и картинки

У каждой секции («Стиль» в инспекторе) — отдельные фоны для компьютера и телефона: загрузка файла или генерация по описанию. Мобильная картинка используется при ширине до 820 px; если её нет, берётся общая. Ползунок затемнения кладёт поверх фона тёмный слой, иначе текст на светлом снимке не читается. Всё уходит в облако (GCS), локально файлы не копятся. Те же две кнопки есть у картинок внутри элементов — например у слайдов слайдера.

Иконки

Каталог из 151 иконки в десяти категориях (связь и интернет, видеонаблюдение и охрана, дом и подключение, деньги и тарифы, поддержка, качество, устройства, документы, бизнес, бренды) с поиском по русским словам: «камера», «скидка», «интернет».

AI-генерация контента

AI-ассистент помогает на всех этапах:

• Генерация сайта по брифу — опишите бизнес, AI соберёт полноценный корп-сайт (7-11 секций) с floating-nav под тип бизнеса.
• Рерайт блока — «Переписать AI» в инспекторе: улучшает тексты, сохраняя смысл.
• SEO — генерация title/description/og из содержимого страницы.
• Генерация items — вопросы FAQ, преимущества, alt-тексты картинок.

Всё, что генерирует AI, проходит ту же серверную валидацию, что и ручной ввод — защита от XSS.

Формы и заявки → CRM

Форма на странице настраивается: воронка CRM (селектор показывается, только когда воронок больше одной), рекламная кампания, источник лида, действие после отправки (сообщение / редирект / оплата), дубль в Telegram организации. Заявка проходит через единый приём биллинга (crm_intake): UTM-атрибуция, антидубль, автораспределение «Неразобранного». Журнал заявок и связанные сделки — в редакторе (кнопка «Заявки»).

Кампания и воронка: что главнее

Заявка получает кампанию и воронку по цепочке приоритетов — от частного к общему:

1. кампания и воронка, выбранные у этой формы;
2. воронка кампании (кампания знает, куда падают её лиды);
3. кампания страницы (вкладка публикации);
4. общая настройка LANDING_DEFAULT_PIPELINE_ID.

У кампании есть организация и воронка, поэтому одна посадочная страница под конкретное объявление считается отдельно от остального трафика.

Проверка адреса → заявка

Блок «Проверка адреса» подсказывает адрес при вводе: сначала дома из базы биллинга (помечены точкой — по ним проверка точная), затем DaData. Ключ DaData наружу не отдаётся, частота запросов ограничена по IP.

Если адрес попал в зону покрытия, поле адреса плавно сменяется полем телефона и кнопкой «Оставить заявку»: телефон спрашивается в момент, когда человек уже увидел «подключим». Заявка уходит в CRM вместе с адресом и пометкой, как именно он проверен. Настройки «куда идёт заявка» у этого блока те же, что у обычной формы.

flowchart LR
  V["Посетитель заполняет форму"] --> C{"Согласие ПД отмечено?"}
  C -- "нет" --> X["Кнопка неактивна"]
  C -- "да" --> S["Отправка формы"]
  S --> I["crm_intake — единый приём"]
  I --> U["UTM-атрибуция + антидубль"]
  U --> D["Сделка в воронке CRM"]
  D --> N["Автораспределение + Telegram"]

Выбранный у формы источник лида применяется целиком: заявка попадает в его воронку и этап входа, получает его теги, распределяется по его правилу и учитывается в его аналитике на панели источников. Если воронка у формы не выбрана, берётся настройка LANDING_DEFAULT_PIPELINE_ID; если и она пуста — воронка по умолчанию для типа сделки. Организация — всегда организация страницы.

Публикация на поддомене

Основной способ — поддомен организации (wifi.вашдомен.ru). При публикации выбирается зона Cloudflare организации, создаётся A-запись с проксированием — SSL включается автоматически. Интеграция с разделом Домены и DNS. Если Cloudflare у организации не настроен — сайт доступен по пути /l/<slug>/ на основном хосте.

flowchart TD
  E["Конструктор — дерево блоков"] --> VAL["Серверная валидация — очистка HTML"]
  VAL --> PUB["Публикация"]
  PUB --> CF{"Cloudflare у организации?"}
  CF -- "да" --> SUB["A-запись поддомена + авто-SSL"]
  CF -- "нет" --> PATH["Путь /l/slug/ на основном хосте"]
  SUB --> LIVE["Сайт в проде — отдача по Host"]
  PATH --> LIVE

Согласие на обработку ПД (152-ФЗ)

Во всех формах — обязательный чекбокс со ссылкой «обработкой персональных данных», открывающей модальное окно (на мобильном полноэкранное) с текстом согласия. Текст берётся из настроек страницы, а если не задан — генерируется AI из реквизитов организации (ИНН, адрес, название из CompanyBranding) в формате 152-ФЗ. Кнопка «Сгенерировать через AI из реквизитов» — в редакторе (вкладка «Сайт»). Форма не отправляется без согласия.

Аналитика

По каждой странице (кнопка «Аналитика»): показы, заявки (валидные/спам), конверсия, лиды в CRM, разбивка по UTM-источникам, динамика заявок по дням (график).

Мульти-организации

Модуль полностью поддерживает мульти-орг:

• Список фильтруется по организации из глобального селектора в шапке (как везде в биллинге).
• При выборе «Все» в карточках показывается бейдж организации.
• Поддомен создаётся в зоне организации страницы, форма → лид в организацию страницы, брендинг и касса — из настроек организации.