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

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

Что Это Такое​

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

Вам не нужно трогать код сайта, кроме добавления одной строки JavaScript.

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

Перейдите в Инструменты → Лид-виджеты на боковой панели (может отображаться под группой навигации "Инструменты").

  1. Нажмите Новый виджет захвата лидов.
  2. Заполните конфигурацию (см. ниже).
  3. Нажмите Сохранить.
  4. Нажмите Получить код вставки на только что созданном виджете.
  5. Скопируйте фрагмент JavaScript и добавьте его на свой сайт.

Параметры Настройки​

Идентификация Виджета​

ПолеЧто делает
НазваниеВнутренняя метка — видна только вашей команде, не посетителям сайта
ЗаголовокОсновной заголовок, отображаемый во всплывающей форме (например, "Свяжитесь с нами")
ПодзаголовокНеобязательный более мелкий текст под заголовком
Текст кнопкиТекст на кнопке отправки (например, "Отправить сообщение")
Сообщение об успехеЧто видит посетитель после отправки формы (например, "Спасибо! Мы свяжемся с вами в ближайшее время.")

Внешний Вид​

ПолеЧто делает
Основной цветЦвет плавающей кнопки и кнопки отправки
Цвет текстаЦвет текста на кнопках (обычно белый)
ПозицияГде на экране появляется кнопка — Снизу справа, Снизу слева, Сверху справа или Сверху слева

Поля Формы​

ПереключательЧто делает
Показать поле телефонаОтображает поле номера телефона в форме
Сделать телефон обязательнымДелает поле телефона обязательным
Показать поле компанииОтображает поле названия компании
Показать поле сообщенияОтображает текстовое поле для сообщения
Сделать сообщение обязательнымДелает поле сообщения обязательным

Имя и email всегда отображаются и всегда являются обязательными.

Маршрутизация Лидов​

Вы можете автоматически направлять лидов, отправленных через этот виджет, в конкретную воронку и этап:

  • Направить лидов в воронку — выберите, в какую воронку попадают новые лиды с виджета
  • Начальный этап — выберите, с какого этапа в этой воронке они начинают

Если оставить эти поля пустыми, лид создаётся без назначения воронки.

Активный/Неактивный​

Переключатель Виджет активен позволяет включать или отключать виджет, не удаляя его. В неактивном состоянии плавающая кнопка не отображается на сайтах, использующих код вставки.

Получение Кода Вставки​

После сохранения виджета найдите его в списке и нажмите Получить код вставки.

Вы увидите фрагмент, похожий на этот:

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

Скопируйте эту строку целиком. Это всё, что нужно добавить на ваш сайт.

Добавление Виджета на Сайт​

WordPress​

  1. Установите плагин "Header Footer Code Manager" или "Insert Headers and Footers" — найдите любой из них в каталоге плагинов WordPress.
  2. Вставьте тег script в область "Footer".
  3. Сохраните и посетите ваш сайт — плавающая кнопка появится.

В качестве альтернативы, если ваша тема WordPress имеет область "Произвольный HTML" в виджете футера, вставьте скрипт туда.

Shopify​

  1. В административной панели Shopify перейдите в Интернет-магазин → Темы.
  2. Нажмите Редактировать код в вашей активной теме.
  3. Откройте файл theme.liquid.
  4. Вставьте тег script прямо перед тегом </body>.
  5. Нажмите Сохранить.

Wix​

  1. В редакторе Wix нажмите кнопку + для добавления элемента.
  2. Выберите Встроить → Произвольный код.
  3. Вставьте тег script в поле кода.
  4. Установите загрузку в секции Body.
  5. Примените и опубликуйте.

Squarespace​

  1. Перейдите в Настройки → Дополнительно → Инъекция кода.
  2. Вставьте тег script в поле Footer.
  3. Сохраните. Виджет появится на всех страницах.

Произвольный HTML-сайт​

Вставьте тег script в любом месте перед закрывающим тегом </body> в вашем HTML-файле:

    <script src="https://yourdomain.com/widget/abc123/loader.js" async></script>
</body>

Как Обрабатываются Заявки​

  1. Посетитель заходит на ваш сайт и видит плавающую кнопку.
  2. Нажимает её, заполняет данные и нажимает "Отправить".
  3. LeadHub мгновенно получает заявку.
  4. В вашем рабочем пространстве создаётся новый лид с информацией посетителя.
  5. Все автоматизации, срабатывающие при "Получение нового лида", запускаются немедленно.
  6. Посетитель видит ваше сообщение об успехе.

Всё происходит в режиме реального времени. Вам не нужно ничего проверять вручную — новые лиды автоматически появляются в вашем списке.

Аналитика Виджета​

На странице списка лид-виджетов каждый виджет отображает:

  • Захваченные лиды — общее количество лидов, отправленных через этот виджет

Это позволяет с первого взгляда увидеть, какие виджеты работают, а какие нет.

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

Все настройки внешнего вида находятся в форме конфигурации виджета. Вы можете изменить:

  • Цвета в соответствии с брендом вашего сайта
  • Позицию кнопки, чтобы избежать наложения с существующими кнопками чата или куки
  • Заголовок и подзаголовок под тон вашего сайта

Вы можете создать несколько виджетов с разными конфигурациями — например, один для главной страницы с "Получить бесплатную консультацию", другой для блога с "Подписаться на обновления".

Безопасность​

CORS (Cross-Origin Resource Sharing)​

По умолчанию виджет принимает заявки с любого сайта. Если вы хотите ограничить домены, с которых можно отправлять заявки через конкретный виджет, установите поле Разрешённые домены в конфигурации виджета. Введите ваш домен (например, acmecorp.com), и будут приниматься только заявки с этого домена.

Ограничение Частоты Запросов​

LeadHub автоматически ограничивает количество заявок, которые один посетитель может отправить за короткое время. Это предотвращает заполнение вашего списка лидов мусорными записями от автоматических ботов.