Перейти к основному содержимому

Конструктор форм

Что такое формы LeadHub?​

В LeadHub есть встроенный конструктор форм, который позволяет создавать контактные формы и встраивать их на сайт. Когда кто-то заполняет форму, в LeadHub автоматически создаётся лид — без копирования и вставки, без загрузок CSV, без ручного ввода.

Формы LeadHub можно использовать вместо (или вместе с) инструментами вроде Typeform или JotForm.

Создание формы​

  1. Перейдите в Лиды > Формы в левой боковой панели.
  2. Нажмите Новая форма.
  3. Заполните раздел Основные сведения:
    • Название формы — внутреннее имя, видимое только вашей команде.
    • Slug — короткое имя для публичного URL (заполняется автоматически из названия).
    • Отображаемый заголовок — заголовок, который видят посетители вверху формы.
    • Описание — необязательно. Короткий текст под заголовком.
    • Подпись кнопки отправки — текст на кнопке отправки. По умолчанию «Отправить».
    • Благодарственное сообщение — сообщение после успешной отправки формы.
    • URL перенаправления — необязательно. Посетитель будет перенаправлен на эту страницу после отправки.
    • Многошаговая форма — включите, чтобы разбить форму на пронумерованные шаги.
    • Активна — включите, чтобы форма принимала заявки.

Добавление полей​

Прокрутите до раздела Поля формы и нажмите Добавить поле.

ТипВнешний вид
Короткий текстОднострочное текстовое поле
Длинный текстМногострочное текстовое поле
EmailПоле email-адреса (проверяет формат)
ТелефонПоле номера телефона
ЧислоВвод только цифр
Выпадающий списокСписок выбора с заданными вариантами
ФлажокОдиночный флажок (да/нет)
Несколько флажковНесколько флажков для выбора нескольких вариантов
ПереключателиНесколько вариантов, выбрать можно один
Загрузка файлаПозволяет посетителю загрузить файл
Выбор датыВыбор даты из календаря
Скрытое полеНе видно посетителям — передаёт фиксированное значение автоматически
Согласие GDPRФлажок согласия для соответствия требованиям защиты данных
Разделитель секцийВизуальная линия для разделения групп полей
  • Метка — вопрос или подпись над полем.
  • Заполнитель / Подсказка — необязательный серый подсказывающий текст внутри поля.
  • Ключ поля — связывает поле со свойством лида (first_name, last_name, email, phone, company).
  • Обязательное — включите, чтобы сделать поле обязательным.
  • Номер шага — в многошаговой форме назначьте каждому полю номер шага.

Поле согласия GDPR — это специальное заблокированное поле. После добавления его нельзя удалить или отредактировать.

Стилизация формы​

Нажмите раздел Внешний вид:

  • Цвет фона — фоновый цвет формы.
  • URL фонового изображения — опциональный URL изображения для фона.
  • Название шрифта Google — например, Inter или Roboto.
  • URL логотипа — отображается в верхней части формы.

Подключение к воронке​

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

Защита от спама​

Включите Включить reCAPTCHA v3 и введите Ключ сайта reCAPTCHA и Секретный ключ reCAPTCHA из вашего аккаунта Google reCAPTCHA.

reCAPTCHA v3 работает в фоновом режиме — посетителям не нужно ничего нажимать.

Встраивание форм на сайт​

Вариант 1 — Прямая ссылка (публичный URL)​

https://yourdomain.com/{your-account-slug}/forms/{form-slug}

Вариант 2 — Встраивание через iframe​

<iframe
  src="https://yourdomain.com/{account-slug}/forms/{form-slug}"
  width="100%"
  height="600"
  frameborder="0">
</iframe>

Вариант 3 — JavaScript-сниппет​

<script src="https://yourdomain.com/widget.js" data-form-id="YOUR_FORM_ID" defer></script>

Поток от отправки формы до создания лида​

  1. Посетитель заполняет форму и нажимает «Отправить».
  2. LeadHub проверяет поля (обязательные, формат email, reCAPTCHA).
  3. LeadHub создаёт новую запись лида со всеми отправленными значениями.
  4. Лид помещается в настроенную воронку и этап.
  5. Источник лида записывается как «LeadHub Web Form».
  6. Автоматизации с триггером «Форма отправлена» или «Новый лид получен» запускаются немедленно.
  7. Посетитель видит благодарственное сообщение (или перенаправляется).

Аналитика форм​

  • Просмотры — сколько раз страница формы была загружена
  • Отправки — сколько раз форма была успешно отправлена
  • Коэффициент конверсии — процент просмотров, завершившихся отправкой

Виджет захвата лидов​

Виджет захвата лидов — это плавающая кнопка в углу вашего сайта. Когда посетитель нажимает на неё, появляется небольшая всплывающая контактная форма.

Создание виджета​

  1. Перейдите в Инструменты > Виджеты лидов.
  2. Нажмите Новый виджет захвата лидов.
  3. Заполните Название, Заголовок, Подзаголовок, Текст кнопки и Сообщение об успехе.

Настройка внешнего вида​

  • Основной цвет, Цвет текста, Позиция (Снизу справа, Снизу слева, Сверху справа, Сверху слева).

Выбор отображаемых полей​

Включите дополнительные поля: телефон, компания, сообщение (каждое можно сделать обязательным). Имя и Email всегда присутствуют и обязательны.

Подключение к воронке​

В разделе Маршрутизация лидов выберите воронку и этап.

Встраивание виджета​

<script src="https://yourdomain.com/widget/{widget-uuid}/loader.js" async></script>

Вставьте этот сниппет перед закрывающим тегом </body> на каждой странице, где нужен виджет.

Отслеживание​

Откройте страницу деталей виджета, чтобы увидеть количество Захваченных лидов.