Как создать умный попап
С помощью конструктора виджетов вы можете создавать умные попапы, которые показываются посетителям только по заданному сценарию. Делайте персональное предложение в нужное время, помогайте клиенту с выбором услуги, или собирайте подписчиков, чтобы продолжить работу с ними в сервисе SendPulse.
Вы можете выбрать готовый шаблон и использовать его в таком виде или отредактировать по своим задачам.
Рассмотрим, как создать виджет из шаблона: настроить внешний вид, сообщение, целевое действие и условие показа.
Перейдите в нужный проект во вкладку «Сценарии показа» и нажмите «Создать попап».
Выберите шаблон
Шаблон — это виджет с предустановленными настройками по внешнему виду и главному действию виджета. Вы можете выбрать шаблон попапа из списка популярных, праздничных, по типу или целью виджета.
По типу попапа
Используется для выбора шаблона по внешнему виду виджета.
Перекрывающий — блок, который перекрывает всю страницу сайта. Для взаимодействия с контентом нужно закрыть окно попапа.
Плавающий — плавающий блок, зафиксированный слева или справа в окне браузера при прокрутке страницы. Не мешает взаимодействовать с контентом.
Горизонтальный — горизонтальный блок, который можно зафиксировать сверху или снизу страницы. Взаимодействию с контентом не мешает.
С видео — блок, который воспроизводит видео с YouTube. Если выбран автоматический сценарий, видео начнет воспроизводиться после любого действия пользователя на странице.
Если выбрана активация по нажатию, после загрузки страницы будет отображаться превью, а воспроизведение видео начнется после клика на попап.
На мобильных устройствах видео попапы всегда воспроизводятся по клику, чтобы не быть навязчивыми.
Модальное окно — блок, расположенный по центру страницы. Контент вне блока затемнен и не кликабельный. Для взаимодействия с контентом нужно закрыть модальное окно.
По действию попапа
Используется для выбора шаблона по целевому действию.
Запрос куки — запрашивает у посетителя согласие на использование куков. По клику на кнопку закрывает попап или посетитель может перейти по ссылке, чтобы ознакомиться с правилами использования куков.
Призыв к действию — призывает посетителя совершить действие: закрыть попап или перевести на целевую страницу.
Подписка на мессенджер — перенаправляет посетителя на страницу выбранной социальной сети. Вы можете добавить любое количество кнопок соцсетей в один попап. Если у вас подключен чат-бот, подпишет на него и отправит приветственную цепочку.
Связь в чате — дает посетителю сайта возможность связаться с вами через соцсеть или форму обратной связи.
Подписка на рассылку — собирает email подписчиков.
Запрос телефона — собирает телефоны подписчиков.
Кастомная форма — собирает дополнительные данные подписчика.
Настройте внешний вид
После выбора шаблона открывается конструктор виджета во вкладке «Контент», где вы можете отредактировать его внешний вид и изменить целевое действие.
Выберите, отображать картинку или нет. Если выбрали отображать картинку, загрузите изображение в формате JPG, PNG или GIF весом до 1 MB и выберите положение относительно текста и кнопки: слева, справа, сверху или на весь экран.
Для типа «Видео» добавьте ссылку на видео в Youtube и выберите, когда проигрывать видео — автоматически или по клику.
Выберите цвет фона — белый, черный или цветной — и расположение попапа на странице.
Вы можете выбрать расположение только для попапов типа «Попап» и «Видео» — слева или справа и «Длинный» — снизу или сверху.
Справа вы можете посмотреть, как будет выглядеть попап на вашем сайте.
Добавьте сообщение
Введите полезное сообщение для посетителей сайта, которое соответствует ситуации и вовлечет потенциальных клиентов во взаимодействие с попапом. Вы можете форматировать текст, добавлять ссылки и эмодзи
К примеру, если посетитель посмотрел страницу продукта более трех раз, сообщение во всплывающем попапе поможет ему сделать выбор, а вам закрыть продажу. Тем, кто находится на странице доставки и оплаты, виджет поможет рассчитать стоимость доставки товара.
Настройте действие
У каждого выбранного шаблона предусмотрено свое целевое действие, которое ожидается от пользователя: нажать на кнопку, подписаться или предоставить контактные данные.
Вы можете пропустить эту настройку, чтобы ничего дополнительно не добавлять, или изменить действие, чтобы убрать или добавить поля и кнопки.
В зависимости от выбранного действия, настройки могут отличаться.
Действие | Описание | Как настроить |
Призыв к действию | Призывает посетителя совершить действие: закрыть попап или перевести на целевую страницу. | Добавьте текст к кнопке и выберите действие — что делать при нажатии на нее: закрыть попап или открыть ссылку. |
Без действия |
Не добавляет элементы для взаимодействия с посетителем. Виджет используется только для показа информации. |
Не имеет кнопки или поля ввода для настройки. |
Подписка на мессенджер |
Перенаправляет посетителя на мессенджер выбранной социальной сети. Вы можете добавить до 10 соцсетей в один попап. Если у вас подключен чат-бот, подписывает на него и запускает цепочки. |
Выберите иконку соцсети и введите текст на кнопке. Для Telegram, WhatsApp, Instagram и Facebook Messenger вы можете выбрать подключенный бот.
|
Подписка на рассылку |
Запрашивает у посетителя его email. Вы также можете сохранить контакт в Email и CRM сервисы. |
Вставьте текст подсказки для поля, в котором подписчики будут оставлять свои контактные данные и введите название кнопки. Для сохранения в Email сервис активируйте «Сохранять в адресную книгу для рассылок» и выберите адресную книгу. Если у вас нет созданной адресной книги, сервис ее автоматически создаст с названием проекта. Для сохранения в CRM активируйте «Создать сделку в CRM» и выберите, в какую воронку и на какой ее этап создавать сделку с данными о контакте. При создании сделок в CRM автоматически создаются контакты в разделе «Контакты». |
Запрос телефона |
Запрашивает у посетителя его телефон. Вы также можете сохранить контакт в Email CRM сервисы. |
|
Кастомная форма |
Запрашивает у пользователя выбранные вами данные. Вы можете добавить в форму дополнительные поля: телефон, емейл, имя, никнейм, местоположение и дату рождения. Вы также можете сохранить контакт в Email и CRM сервисы. |
После того как настроили внешний вид и действие, нажмите «Далее».
Настройте сценарий показа
В следующем окне вы перейдете во вкладку «Таргетинг». Вы можете отслеживать поведение посетителей и отображать виджет только тогда, когда пользователь совершает определенное действие: прокручивает страницу до определенной части или проводит на сайте больше 40 секунд.
Типы условий
Выберите событие, которое отслеживать в поведении посетителя сайта, оператор условия и введите отслеживаемое значение.
Событие | Описание | Как настроить |
Показывать всегда |
Виджет будет отображаться сразу при переходе на сайт, не ожидая выполнения различных условий. |
|
UTM Medium |
Отслеживает по параметру, который определяет тип трафика. Виджет активируется только у пользователей с заданным значением параметра |
Выберите условие «равно», «не равно» или «содержит». Введите значение, равное или содержащее символы параметра Возможные значения:
|
UTM Content |
Отслеживает по параметру, который определяет часть страницы, с которой пользователь пришел. Виджет сработает только у пользователей с заданным значением параметра |
Выберите условие «равно», «не равно» или «содержит». Введите значение, равное или содержащее символы параметра Возможные значения:
|
UTM Term |
Отслеживает по параметру, который определяет ключевое слово или фраза запроса, по которому пользователь попал на сайт из поисковой системы. Виджет сработает только у пользователей с заданным значением параметра |
Выберите условие «равно», «не равно» или «содержит».
Введите значение, равное или содержащее символы параметра |
UTM Campaign |
Отслеживает по параметру, который определяет название рекламной кампании. Виджет будет отображаться только у пользователей с заданным значением параметра |
Выберите условие «равно», «не равно» или «содержит». Введите значение, равное или содержащее символы параметра |
UTM Sourse |
Отслеживает по параметру, который определяет источник трафика, откуда пользователь перешел. Виджет отобразится только для пользователей с заданным значением параметра |
Выберите условие «равно», «не равно» или «содержит». Введите значение, равное или содержащее символы параметра Возможные значения:
google — поисковая система;
|
Тип трафика |
Отслеживает, откуда перешел посетитель. Виджет активируется только у посетителей с выбранного канала трафика. |
Выберите условие «равно», или «не равно». Выберите один из семи возможных типов трафика:
|
Время на текущей странице |
Отслеживает время на текущей странице. Виджет сработает, когда посетитель проведет на странице указанное в настройках время. |
Выберите условие «больше» или «меньше». Введите значение, которое будет больше или меньше длительности посещения целевой страницы в секундах, минутах или часах. |
Время на сайте |
Отслеживает время, проведенное на всех страницах сайта. Виджет сработает, когда посетитель проведет на сайте указанное в настройках время. |
Выберите условие «больше» или «меньше». Введите значение, которое будет больше или меньше длительности посещения сайта в секундах, минутах или часах |
Количество сессий |
Отслеживает количество сессий посетителя. Виджет сработает, когда пользователь совершит заданное в настройках количество сессий. |
Выберите условие «больше» или «меньше». Введите значение, которое будет больше или меньше целевого количества сессий на одного пользователя |
Скролл более 50% страницы |
Отслеживает глубину просмотра страницы. Виджет сработает, когда посетитель прокрутит половину страницы. |
Выберите «да» или «нет». |
Уход курсора за пределы экрана |
Отслеживает движение курсора мышки. Виджет сработает, если посетитель начнет или не начнет движение курсором для перехода на другую вкладку или закрытия текущей. |
Выберите «да» или «нет». |
Источник трафика |
Отслеживает страницу, с которой перешел посетитель. Виджет сработает, если заданный URL соответствует URL перехода. |
Выберите условие «равно», «не равно» или «содержит». Введите адрес страницы, с которой пользователь перешел на ваш сайт. |
URL текущей страницы |
Отслеживает, на какой странице пользователь сейчас находится. Вы можете выбирать эту настройку для показа (или скрытия) попапа на определенных страницах сайта. Виджет сработает после загрузки страницы с заданным URL. |
Выберите условие «равно», «не равно» или «содержит».
Введите значение, которое содержит ссылку или часть ссылки на целевую страницу.
|
URL посещенной страницы |
Отслеживает, с какой страницы перешел пользователь. Виджет сработает после загрузки страницы с заданным URL. |
Выберите условие «равно», «не равно» или «содержит». Введите значение, которое содержит ссылку или часть ссылки на целевую страницу. |
Заголовок страницы |
Отслеживает страницы по названию заголовка. Виджет сработает, когда посетитель зайдет на страницу с таким же заголовком. |
Выберите условие «равно», «не равно» или «содержит». Введите значение, равное или содержащее символы заголовка целевой страницы. |
Браузер |
Отслеживает, с какого браузера и на каком устройстве заходит посетитель. Виджет сработает, когда посетитель зайдет на сайт из определенного браузера или любого браузера на мобильном/десктопе. |
Введите значение, которое совпадает с названием браузера или соответствует всем браузерам на мобильных устройствах или на десктопах. |
Период дат |
Отслеживает дату, в которую посетитель зашел на сайт. Виджет будет срабатывать только на протяжении выбранного времени |
Выберите временной интервал, когда виджет будет отображаться на сайте. После 00:00 начинается отсчет нового дня. Поэтому ночные периоды времени нужно прописывать по формуле: «период до 23:59», оператор «или», «период с 00:01». При создании учитывается часовой пояс вашего браузера, а при использовании — часовой пояс ваших клиентов. |
Посещено страниц |
Отслеживает количество посещенных страниц за все время. Виджет сработает, когда пользователь посетит больше или меньше определенного количества страниц. |
Выберите условие «больше» или «меньше». Введите значение, соответствующее количеству страниц, которые необходимо просмотреть, прежде чем запустится виджет. |
Посещено страниц в текущей сессии |
Отслеживает количество посещенных страниц за текущую сессию. Виджет сработает, когда пользователь посетит больше или меньше определенного количества страниц на протяжении одной сессии. |
Выберите условие «больше» или «меньше». Введите значение, которое будет больше или меньше количества страниц, посещенных в ходе текущей сессии. |
Язык браузера |
Отлеживает язык, выставленный у посетителя в настройках браузера Вы можете выбирать эту настройку для показа (или скрытия) попапа для разных языковых версий сайта. |
Выберите условие «равно» или «не равно». Выберите язык браузера из списка. |
Добавление связывающих операторов
И или
Если вы хотите добавить дополнительные значения для текущего типа условия, щелкните значок + справа.
Выберите оператор «и» или «или».
Оператор «и» используется, чтобы учитывалось строго каждое значение — и первое, и второе. Если одно из условий не учитывается, то попап не появится на сайте.
Оператор «или» используется, чтобы учитывалось любое из значений — первое или второе.
Каждое любое
Вы можете комбинировать разные типы условий и проверять информацию сразу по нескольким параметрам.
Если вы хотите добавить еще одно условие, нажмите «Добавить условие».
Выберите порядок выполнения условий:
Оператор «каждое» используется, чтобы попап отобразился только при наступлении всех заданных условий.
Оператор «любое» используется, чтобы попап отобразился при выполнении любого из заданных условий.
Задайте название сценария
По умолчанию, название проекта берется из даты и времени, когда создается сценарий. Чтобы изменить название, нажмите на соответствующую иконку возле названия.
Опубликуйте попап
После того как настроили условия, нажмите «Сохранить и опубликовать».
Чтобы изменения отобразились и вы могли все проверить в своем браузере, после сохранения очистите кэш и куки браузера.
Все попапы отображаются в разделе «Сценарии на сайте» в отдельных вкладках. После создания вы можете посмотреть внешний вид попапа, отслеживать статистику и отредактировать любую настройку, кроме типа попапа.
Обновлено: 13.01.2023
Регистрация через соцсети
Войти через Facebook Войти через Google