Конструктор страниц
Конструктор открывается в разделе «Конструктор» меню лендинга. В центре — страница в рамке телефона, сбоку появляется панель настроек страницы или выбранного блока.
Правки сохраняются сами — отдельной кнопки сохранения нет. Сохраняется черновик: посетители увидят изменения только после того, как вы нажмёте «Опубликовать». Об этом — на странице Публикация и свой домен.
Кнопка «Помощь ИИ» рядом с «Опубликовать» открывает ИИ-чат по этой странице — см. Сборка лендинга в ИИ-чате.
Страницы лендинга
В лендинге может быть несколько страниц. Первая — «Главная» — открывается по адресу лендинга, остальные — по адресу лендинга с дополнением, например …/price.
Над рамкой телефона — название открытой страницы и значки:
| Значок | Что делает |
|---|---|
| Шестерёнка | Открывает «Настройки страницы» |
| Список | Открывает панель «Страницы» |
| Стрелка наружу | Открывает опубликованную страницу в новой вкладке. Значок есть только у опубликованной страницы |
Панель «Страницы»
В панели — список страниц с адресами и поиск. Клик по странице открывает её в конструкторе.
- «Создать страницу» — окно «Создание страницы» с полями «Имя страницы» и «Адрес страницы». Адрес — латинские буквы, цифры, дефис и подчёркивание.
- Меню «⋯» у страницы: «Редактировать» (имя и адрес), «Создать копию», «Удалить».
Копия получает имя с пометкой «(копия)» и адрес с окончанием -copy. Последнюю страницу лендинга удалить нельзя.
Внимание
Не удаляйте «Главную» через меню «⋯», если в лендинге есть другие страницы: кабинет это позволит, но без главной страницы адрес лендинга перестанет открываться.
Настройки страницы
| Настройка | Что задаёт |
|---|---|
| «Имя страницы» | Название страницы. Оно же служит заголовком вкладки браузера, пока не заполнен заголовок в «Настройки SEO» |
| «URL» | Адрес страницы внутри лендинга. У главной страницы это / |
| «Внутренний отступ страницы по краям» | Поля по краям: без отступа или размер от XS до LG |
| «Цвет фона» | Фон страницы — отдельно для светлой и тёмной темы |
| «Шрифт по умолчанию» | Шрифт всех блоков страницы, у которых не выбран свой |
| «Настройки SEO» | «Заголовок» — до 80 символов, «Ключевые слова» — до 250, «Описание» — до 170 |
SEO-поля попадают в служебную часть опубликованной страницы — их читают поисковые системы и сервисы, которые строят превью ссылки. Картинкой для соцсетей служит иконка лендинга: отдельного поля для такой картинки нет. Поля обновляются на сайте при следующей публикации.
Кнопка «Удалить» внизу панели удаляет страницу. У главной страницы её нет.
Блоки
Страница состоит из блоков, идущих сверху вниз. Блоков пять: «Текстовый блок», «Картинка», «Кнопки», «Форма», «HTML».
- Добавить. Нажмите «+» под последним блоком и выберите вид блока. Чтобы вставить блок выше уже стоящего, нажмите на линию над ним и выберите вид блока.
- Настроить. Клик по блоку открывает его панель настроек.
- Переместить. Перетащите блок за значок слева от него.
- Удалить. Кнопка «Удалить» внизу панели настроек блока.
Текстовый блок
Текст набирается прямо на странице. Выделите часть текста — появится панель: полужирный, курсив, подчёркнутый, зачёркнутый, ссылка, цитата. Клавиша Enter начинает новый абзац, Shift + Enter переносит строку.
В панели настроек:
- выравнивание и цвет текста;
- «Тип текста» — «Заголовок 1» – «Заголовок 4» или «Обычный текст»;
- «Шрифт», «Размер шрифта», «Толщина шрифта», «Высота строки», «Межбуквенный интервал»;
- «Внутренние отступы сверху и снизу», «Внутренние отступы слева и справа».
Картинка
Нажмите «Выбрать фото» и загрузите изображение — JPG, PNG или GIF. Картинку можно двигать внутри рамки мышью или пальцем, чтобы выбрать видимую часть.
В панели настроек — пять вариантов рамки:
| Вариант | Как выглядит |
|---|---|
| С полями | Картинка в своих пропорциях, вокруг — отступы |
| Во всю ширину | Картинка в своих пропорциях, без отступов |
| Квадрат | Квадрат с отступами |
| Квадрат во всю ширину | Квадрат без отступов |
| Круг | Круг с отступами |
Ниже — «Радиус» (скругление углов), «Размер» (у вариантов с отступами), «Масштаб» (приближение от 100 до 300%) и отступы блока.
Кнопки
Блок с одной или несколькими кнопками-ссылками. Так делают ссылки на чат-бота, мессенджеры, соцсети, сайт.
Под выбранным блоком — кнопки «Добавить кнопку» и «Настройки». Новая кнопка повторяет оформление предыдущей.
Настройки блока задают общее для всех кнопок: «Размер по умолчанию», «Радиус по умолчанию», «Шрифт по умолчанию» и «Оформление» — как кнопки стоят: каждая во всю ширину на своей строке, компактно или слитно одной группой (нужно не меньше двух кнопок). В первом варианте кнопки меняются местами перетаскиванием.
Настройки кнопки открываются кликом по ней:
| Настройка | Что задаёт |
|---|---|
| «Имя кнопки» | Надпись на кнопке |
| «Ссылка» | Адрес, который откроется по нажатию. Для звонка — tel: и номер, например tel:+79990000000; для письма — mailto: и почта, например mailto:hello@example.com. Такие ссылки открывают телефон или почтовую программу, а не новую вкладку |
| «Открывать в новой вкладке» | Открывать ссылку в новой вкладке браузера |
| «Иконка» | Значок мессенджера или YouTube рядом с надписью либо «Без иконки»; «Положение иконки» — «Слева» или «Справа» |
| «Размер», «Шрифт», «Размер шрифта», «Толщина шрифта», «Межбуквенный интервал», «Стиль», «Радиус» | Вид надписи и самой кнопки. «По умолчанию» берёт значение из настроек блока |
| «Цвет» | «Цвет текста» и «Цвет фона»; отдельно включаются «Цвет при наведении» и «Цвет при нажатии» |
| «Градиент», «Граница», «Тень» | Включаются переключателями; у каждого — свои варианты при наведении и при нажатии |
Переключатель «Применить ко всем в блоке» в строке «Настройки дизайна» распространяет оформление этой кнопки на остальные кнопки блока. Кнопки «Скопировать стиль» и «Вставить стиль» переносят оформление между кнопками — в том числе на другую страницу.
Совет
Чтобы кнопка вела в чат-бота, вставьте в поле «Ссылка» общую или дополнительную ссылку на бота из раздела «Ссылки на чат-бота». Тогда переходы попадут в статистику бота. Где взять ссылку — в разделе Ссылки на чат-бота.
Форма
Форма собирает данные посетителя и передаёт их в чат-бота. Новая форма уже содержит поле ввода, чекбокс согласия и кнопку «Отправить».
Под выбранным блоком — «Добавить элемент» и «Настройки». Элементов четыре:
| Элемент | Что это |
|---|---|
| «Поле ввода» | Поле с подписью. «Тип поля»: «Телефон», «E-Mail», «Текст», «Цифры», «Многострочный текст», «Дата», «Время», «Дата и время». Есть «Текст-подсказка» и переключатель «Обязательное поле» |
| «Текст» | Пояснение внутри формы |
| «Чекбокс» | Галочка с текстом, например согласие с политикой. «Имя поля» — под каким именем значение придёт в бота; есть «Включить по умолчанию» и «Обязательное поле» |
| «Кнопка» | Кнопка отправки. В поле «Ссылка на чат-бот» вставляют ссылку на бота |
Клик по элементу открывает его настройки, элементы меняются местами перетаскиванием. Общие настройки блока — «Размер формы по умолчанию», отступы, «Радиус по умолчанию», «Шрифт по умолчанию».
Как форма передаёт данные.
- Посетитель заполняет форму и нажимает кнопку. Платформа проверяет обязательные поля и формат: почту, телефон, число, дату.
- Посетитель переходит по адресу из поля «Ссылка на чат-бот» и попадает в мессенджер.
- Бот получает значения полей как переменные контакта. Имя переменной — подпись поля («Название» в настройках поля) или «Имя поля» у чекбокса. Если подпись не задана, переменная называется
Input 1,Checkbox 1и так далее. Чекбокс приходит как ✅ или ❌.
Например, поле с подписью «Телефон» придёт в бота переменной Телефон со значением +7 000 123-45-67. Как использовать переменные в сообщениях — в разделе Автоподстановки.
Важно
Форма не хранит заявки сама. В кнопке должна стоять ссылка на чат-бота этой платформы — общая или дополнительная, из раздела «Ссылки на чат-бота». Без неё введённые данные никуда не попадут.
Чтобы заявки не терялись, сохраняйте их в сценарии бота: в переменные контакта, в список или в CRM.
HTML
Блок для своего кода: в панели настроек — редактор, в который вставляют HTML. В конструкторе результат показывается сразу.
Внимание
«Блок работает только при подключении домена» — на странице с адресом платформы код этого блока не выполняется. Как подключить домен — на странице Публикация и свой домен.
Цвета для светлой и тёмной темы
У каждого цвета на странице — фона, текста, кнопок, полей формы — два значения. В окне выбора цвета две вкладки: «Светлая тема» и «Темная тема». На кнопке выбора цвета оба значения показаны рядом — со значком солнца и луны.
Тёмный вариант страницы включается в настройках лендинга переключателем «Темная тема». Пока он выключен, достаточно задать цвета для светлой темы.
В конструкторе страница показана в теме вашего кабинета: в светлом кабинете видны светлые цвета, в тёмном — тёмные.
Шрифты
В списке шрифтов — «Системный» и 14 шрифтов: Amatic SC, Caveat, Comfortaa, Kelly Slab, Lobster, Merriweather, Montserrat Alternates, Open Sans, Open Sans Condensed, Oswald, Pacifico, Pangolin, PT Mono, Roboto. Вариант «По умолчанию» у блока берёт шрифт страницы.
Чего в конструкторе нет
- Блока чата. Чтобы посетитель написал боту, поставьте кнопку со ссылкой на бота. Чат прямо на сайте делается виджетом.
- Блоков видео, карты, таймера и оплаты.
Если что-то не работает
- «Такой адрес страницы уже существует.» У двух страниц одного лендинга не может быть одинакового адреса.
- «Адрес страницы введен некорректно» — в адресе допустимы только латинские буквы, цифры, дефис и подчёркивание.
- «Вы не можете удалить последнюю страницу.» В лендинге всегда остаётся хотя бы одна страница.
- Бот не получил данные формы. Проверьте, что в кнопке формы стоит ссылка на бота из раздела «Ссылки на чат-бота» и что у полей заполнены подписи. Данные формы ждут перехода недолго: если посетитель открыл ссылку и не перешёл в мессенджер сразу, значения могут не дойти.