Как создать и настроить «Ловец лидов»

«Ловец лидов» показывает на сайте окно с предложением и формой: скидка на первый заказ, чек-лист, бесплатный замер, запись на консультацию. Посетитель оставляет телефон или email, заявка приходит в кабинет, на почту или в Telegram, а на экране «Спасибо» он сразу получает обещанное: промокод, ссылку или файл. Ниже по шагам: как создать окно, что настроить в каждой карточке редактора, как поставить код на сайт и где смотреть результат.

Виджет доступен на всех тарифах, на Free можно создать одно окно. Цвета и шрифты меняются на Pro и Business, на Free выбирается готовый шаблон, подробнее в статье «Ловец лидов: настройка дизайна и шаблоны». Что умеет виджет в целом, показано на странице «Ловец лидов».

Создайте окно за пять минут

1. Войдите в личный кабинет app.allwidgets.ru и в блоке «Мои виджеты» выберите плитку «Ловец лидов».
2. Нажмите «Новый виджет», в окне «Укажите ваше название для нового виджета» впишите название (его видите только вы) и нажмите «Создать».
3. В списке под карточкой окна нажмите «редактировать». Откроется редактор, справа живое превью.
4. В карточке «Формат и сценарий» выберите, как появится окно: по центру, сбоку, плашкой, во весь экран, в углу или блоком в странице.
5. В карточке «Содержимое окна» включите нужные блоки и впишите своё предложение: заголовок, текст, выгоды. Проверьте поля в карточке «Форма» и галочку согласия.
6. В карточке «Экран «Спасибо» и бонус» выберите, что получит посетитель после заявки: только «спасибо», промокод, ссылку или файл.
7. Проверьте карточки «Когда показывать» и «Кому и где показывать»: значения по умолчанию подходят для большинства сайтов.
8. Включите уведомления о заявках на почту или в Telegram и нажмите «Сохранить».
9. Нажмите «Код для вставки», скопируйте код кнопкой «Скопировать» и вставьте его на все страницы сайта, где должно работать окно.
10. Откройте сайт, дождитесь окна или нажмите свою кнопку с #aw-lead, отправьте тестовую заявку и найдите её в разделе «Заявки».

Карточки редактора по порядку

Редактор разбит на карточки. Всё, что вы меняете, сразу видно в превью справа, сохранять для этого не нужно. Над превью переключатель «Компьютер / Телефон» и шаги окна «Оффер / Форма / Спасибо / Ярлык»: так можно посмотреть каждый экран, не заполняя форму. Заявки и клики из превью никуда не отправляются и в статистику не попадают.

«Основное»

«Название виджета» видно только вам. Переключатель «Временно отключить» скрывает окно на сайте, настройки при этом сохраняются. «Показывать на мобильных» включён по умолчанию: если его снять, окно не появится на телефонах ни само, ни по кнопке, а в правиле «Устройства» редактор сам выберет «Только компьютеры».

«Формат и сценарий»

Шесть форматов: «Окно по центру», «Боковая панель», «Плашка», «Во весь экран», «Карточка в углу», «Блок в странице». Для плашки выбирается, где она будет («Снизу экрана» или «Сверху экрана»), для панели, карточки и ярлыка сторона «Справа» или «Слева». Здесь же два переключателя:

• «Сначала вопрос «Да / Нет», потом форма»: окно сначала спрашивает, нужна ли посетителю скидка, и только после «Да» показывает форму. Тексты кнопки «Да» и ссылки «Нет» задаются рядом.
• «Ярлык у края экрана после закрытия»: если посетитель закрыл окно, у края остаётся небольшой ярлык, например «Скидка 10%», и по нему окно откроется снова.

Когда какой формат выбирать, разобрано в статье «Форматы окна, таймер, бонус и согласие на обработку ПДн».

«Шаблон» и «Дизайн»

Пять шаблонов: «Минимал», «Стекло» (выбран по умолчанию), «Неон», «Премиум» и «Пастель». В карточке «Дизайн» на Pro и Business меняются цвета, шрифты, ширина окна, скругления, затемнение страницы и анимация.

«Содержимое окна»

Окно собирается из восьми блоков: «Надзаголовок», «Заголовок», «Крупный акцент» (например, −20%), «Текст», «Картинка или иллюстрация», «Список выгод», «Таймер» и «Форма». Каждый блок включается переключателем, порядок меняется стрелками или перетаскиванием, а кнопка со стрелкой вниз раскрывает его настройки. В тексте работают **жирный** и ~~старая цена~~ (зачёркнутая). Для картинки есть пять готовых иллюстраций или своя картинка по ссылке.

Если выключить блок «Форма», окно покажет предложение с кнопкой, а форма откроется отдельным шагом.

«Форма»

По умолчанию в форме два поля: «Имя» и обязательный «Телефон». Можно добавить «Email», «Текст», «Комментарий» и «Выбор из списка», всего не больше шести полей. Без телефона или email заявка не будет принята, редактор об этом предупредит. Ниже текст кнопки отправки, «Ссылка-отказ под кнопкой», необязательная подпись и блок «Согласие на обработку персональных данных»: галочка включена по умолчанию, впишите ссылку на текст согласия и политику конфиденциальности вашего сайта.

«Экран «Спасибо» и бонус»

Заголовок и текст экрана после заявки и то, что получает посетитель: «Только «спасибо»», «Промокод», «Ссылка» или «Файл». Промокод и ссылка не видны в коде вашего сайта, посетитель получает их только после отправки формы.

Когда показывать окно

Карточка «Когда показывать» задаёт триггеры. Окно появится, когда сработает любой из включённых, один раз за страницу.

• «Через время на странице», от 0 до 600 секунд, по умолчанию 20.
• «После прокрутки страницы», процент от 5 до 100, по умолчанию 50.
• «При попытке уйти»: на компьютере окно появляется, когда курсор уходит за верхний край окна браузера (не раньше чем через 3 секунды после загрузки), на телефоне — когда посетитель пролистал больше 30 % страницы и резко прокрутил вверх.
• «По клику на элемент сайта»: впишите CSS-селектор своих кнопок, например .btn-discount, #get-offer.

Ниже в карточке три способа, которые работают всегда, даже если все триггеры выключены. Их удобно ставить на свои кнопки «Получить скидку» в меню или на баннере:

<a href="#aw-lead">Получить скидку</a>
<button data-aw-lead>Получить скидку</button>
AWLead.open(); // из своего скрипта, например в обработчике клика

Такое явное открытие срабатывает на любой странице, даже если окно уже показывали или закрывали, и не ждёт, пока закроются чужие окна. Ограничивают его только устройства и окончание акции по таймеру. Если на странице несколько окон, укажите uuid нужного: AWLead.open('uuid') или data-aw-lead="uuid". Кнопка «Копировать» рядом с примером подставит uuid этого окна.

Есть и общий вызов для всех виджетов «Все Виджеты»: window.allwidgets.open('leadcatcher', 'uuid'). Если скрипта этого окна на странице нет, вызов подгрузит его и откроет окно, когда оно будет готово (до 10 секунд). Сам вызов появляется на странице вместе со скриптом любого нового виджета сервиса.

Кому и где показывать

Карточка «Кому и где показывать» защищает посетителей от лишних окон:

• «Страницы»: «На всех страницах», «Только на указанных» или «На всех, кроме указанных». Адреса пишутся по одному в строке: /catalog/* — весь раздел, /contacts/ — одна страница, *utm_source=vk* — посетители с меткой в адресе.
• «Устройства»: «Компьютеры и телефоны», «Только компьютеры» или «Только телефоны».
• «Как часто показывать»: «Раз за визит», «Не чаще раза в сутки» (по умолчанию), «Не чаще раза в неделю», «Один раз» или «На каждой странице (не рекомендуем)».
• «Закрыли окно — не показывать» столько дней, от 0 до 90, по умолчанию 3.
• «Не показывать тем, кто уже оставил заявку» включено по умолчанию.
• «Бережно на телефонах»: на телефоне триггер «Через время на странице» срабатывает не раньше чем через 30 секунд, а «После прокрутки страницы» — не раньше половины страницы. Окно появится по тому из них, что сработает первым. Уход и клики правило не задерживает.
• «Не мешать другим окнам»: окно само не появится, пока открыто окно другого виджета «Все Виджеты» (колесо фортуны, «Вам подарок», квиз, калькулятор, «Фокус», раскрытая мультикнопка или форма заказа звонка, другой «Ловец лидов») или модальное окно сайта. Баннер cookie задерживает окно не дольше 20 секунд от загрузки страницы: если посетитель на него не отвечает, окно появится и при открытом баннере. После закрытия окна квиза, калькулятора, колеса, подарка, мультикнопки или другого «Ловца» оно выждет ещё 15 секунд. Пока окно «Ловца» открыто, автопоказы других виджетов тоже ждут; плашка и блок в странице их не задерживают.
• «Тихие часы»: в заданное время окно само не появляется (по клику — да). Время считается по часам посетителя или по Москве, по умолчанию с 22:00 до 09:00.

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

Для формата «Блок в странице» из этих правил действует только «Устройства», а ещё окончание акции: если в таймере выбрано «Больше не показывать», после конца акции блок тоже пропадает. Правило «Страницы» блок не учитывает: он появляется везде, где стоит контейнер или найден селектор, поэтому ставьте их только на нужные страницы.

Уведомления, аналитика и сохранение

В карточке «Уведомления о заявках» включите «Присылать заявки на почту» и впишите адрес, «Присылать заявки в Telegram» (чат привязывается в профиле) или «Отправлять заявки на вебхук». Все заявки в любом случае сохраняются в разделе «Заявки». Подробнее в статье «Заявки из новых виджетов: раздел «Заявки», почта, Telegram, вебхук».

В карточке «Аналитика» включите «Цели в Яндекс Метрике» и впишите номер счётчика. Тогда виджет отправляет цели:

• aw_lc_show — окно показано;
• aw_lc_yes — нажали «Да» или начали заполнять форму;
• aw_lc_lead — заявка отправлена, вместе с ней общая цель aw_leadcatcher.

Этот же список с пояснениями показан в карточке «Аналитика» под номером счётчика. Создайте цели в счётчике с типом «JavaScript-событие». Если включить переключатель «Google Analytics», те же цели уходят и туда через gtag. Как создать цели в Метрике, описано в статье «Цели Яндекс Метрики новых виджетов». Для своих скриптов виджет отправляет событие aw:leadcatcher на document и события aw_lc_* в dataLayer, если он есть на сайте.

Последняя карточка, «White Label», на тарифе Business убирает ссылку «работает на технологии Все Виджеты» или заменяет её своим HTML. Когда всё готово, нажмите «Сохранить» вверху или внизу страницы.

Установите код на сайт

Нажмите «Код для вставки» внизу редактора. В окне «Код для вставки на сайт» будет строка вида:

<script src="https://app.allwidgets.ru/s/leadcatcher/ваш-uuid/" async></script>

Скопируйте её кнопкой «Скопировать» и вставьте на все страницы, где должно работать окно, перед </body> или в любом месте страницы. Код один и тот же для всех правил: какие страницы и устройства, решают настройки в кабинете, менять код после правок не нужно. Куда вставлять код на Tilda, WordPress, 1С-Битрикс и через Google Tag Manager, рассказано в статье «Как установить виджет на сайт».

Проверьте окно на сайте

Откройте сайт в обычном окне браузера и подождите 20 секунд или прокрутите половину страницы. Быстрее проверить через свою ссылку: добавьте на страницу <a href="#aw-lead">Тест</a> и нажмите на неё. Отправьте форму со своим телефоном и проверьте, что заявка появилась в разделе «Заявки» и пришло уведомление.

Если окно не появляется само, вспомните правила: после показа оно по умолчанию не появляется сутки, после закрытия — 3 дня, после заявки не показывается совсем, на телефоне ждёт 30 секунд или прокрутки половины страницы, а пока открыто другое окно, ждёт его закрытия. Проще всего проверить автопоказ в окне инкогнито.

Статистика окна

В списке окон нажмите «статистика». Страница показывает воронку за 7, 30 или 90 дней: «Показы окна», «Заинтересовались» (нажали «Да» или начали заполнять форму) и «Заявки», а также «Конверсия показа в заявку» и сколько посетителей закрыли окно без заявки. Ниже таблица по дням, сутки считаются по Москве. Показы из превью кабинета не считаются.

Если показов много, а интереса мало, поменяйте предложение или заголовок. Если интерес есть, а заявок нет, сократите форму до одного-двух полей. Что предложить посетителю и как не потерять его доверие, разобрано в блоге: «Лид-магнит и pop-up: как собирать контакты и не потерять доверие».