Как создать всплывающее окно с намерением ухода

Как создать всплывающее окно с намерением выхода, чтобы увеличить ваш список адресов электронной почты в 5 раз

Ищете способ создать всплывающее окно при намерении уйти для вашего сайта WordPress?

Всплывающее окно при намерении уйти может быть невероятно эффективным для сбора лидов. Они разработаны для убеждения и конвертации, привлекая все внимание посетителя на себя.

Но создавать его с нуля — настоящая головная боль. Во-первых, вам нужно знать достаточно HTML, CSS и Javascript, чтобы создать всплывающее окно вместе с правилами триггера для его отображения. Затем вам придется вручную интегрировать его с вашим поставщиком услуг электронной почты. И, наконец, вам придется иметь дело с любыми проблемами конфиденциальности и безопасности.

Хорошие новости: есть гораздо более простой способ.

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

Давайте начнем.

Что такое всплывающее окно при намерении уйти?

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

Короче говоря: всплывающее окно при намерении уйти создано для конвертации посетителей, которые иначе ушли бы, не совершив конверсию.

Вот пример:

Всплывающие окна при намерении уйти

Вы можете использовать всплывающие окна при намерении уйти для:

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

Как создать всплывающее окно при намерении уйти в WordPress

Теперь, когда вы понимаете, что такое всплывающее окно при намерении уйти и почему вы захотите его создать, как его создать? Мы рекомендуем использовать OptinMonster для создания всех ваших всплывающих окон.

Главная OptinMonster

OptinMonster — это лучший набор инструментов для конверсии в мире, и мы сами им пользуемся. OptinMonster очень просто создавать мощные всплывающие окна, которые конвертируют. И вам никогда не придется использовать какой-либо код.

OptinMonster имеет практически все, что вам нужно для начала, роста и масштабирования вашего процесса генерации лидов по электронной почте.

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

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

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

Шаг №1: Создайте кампанию

Перейдите на панель управления OptinMonster и нажмите кнопку Создать:

Создать новую кампанию всплывающих окон

Выберите опцию Шаблон, чтобы начать создание формы подписки с использованием предварительно разработанного шаблона:

Создать новую кампанию OptinMonster

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

Выберите тип кампании «На весь экран»

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

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

Кроме того, в зависимости от вашего плана, вы также можете использовать OptinMonster на нескольких сайтах. Поэтому выберите веб-сайт, на котором вы хотите отображать свою кампанию.

Создать идентификатор кампании

Нажмите Start Building , когда закончите.

Шаг № 2: Редактирование всплывающего окна

С OptinMonster вы получите визуальный конструктор всплывающих окон с перетаскиванием. Как только вы закончите создание своей кампании, вы сможете редактировать даже мельчайшие детали вашего всплывающего окна. Начните с редактирования заголовка вашего всплывающего окна:

Редактировать полноэкранное всплывающее окно OptinMonster

Самое удивительное здесь то, что вы просто нажимаете на любой текст, который хотите отредактировать, и меняете его прямо на месте. Нет необходимости заполнять форму или редактировать какой-либо HTML-код во всплывающем окне.

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

Шаг № 3: Добавление кнопки «Нажмите, чтобы подписаться» в ваше всплывающее окно

Push-уведомления помогают вам автоматически увеличивать трафик вашего сайта и вовлеченность. И если вы управляете интернет-магазином, PushEngage также помогает вам увеличить продажи, помогая создавать автоматические push-уведомления для электронной коммерции.

Вы можете начать бесплатно, но если вы серьезно относитесь к развитию своего бизнеса, вам следует приобрести платный план. Кроме того, прежде чем покупать какую-либо службу push-уведомлений, ознакомьтесь с этим руководством по стоимости push-уведомлений.

Вот краткий обзор того, что вы получаете с PushEngage:

  • Высококонверсионные автоматизированные кампании
  • Множеством вариантов таргетинга и планирования кампаний
  • Отслеживанием целей и расширенной аналитикой
  • Интеллектуальным A/B-тестированием
  • Выделенный менеджер по успеху

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

Сначала добавьте блок HTML в ваше всплывающее окно из боковой панели в OptinMonster.

Добавить HTML-блок в OptinMonster

Здесь мы добавим код для сбора подписчиков push-уведомлений. Сначала вставьте следующий код, чтобы создать кликабельную кнопку:

<button onclick="subscribeOnClickButton()" style="border: none; width: 100%; padding-left: 15%; padding-right:15%; text-align: center; display: inline-block; color: white;">Get Updates via Push Notifications</button>

Вставьте код туда, где указано, что можно добавить HTML:

Добавить HTML-код во всплывающее окно

Конечно, вы можете поэкспериментировать со стилями, чтобы сделать его более привлекательным. Далее мы сделаем так, чтобы кнопка собирала подписчиков push-уведомлений при нажатии.

Перейдите на главную страницу PushEngage и нажмите кнопку Начать:

PushEngage

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

В вашей панели управления PushEngage перейдите в раздел Настройки сайта » Детали сайта и нажмите кнопку Нажмите здесь для инструкций по настройке. В разделе Любой сайт вы получите код установки:

Код установки PushEngage для любого сайта

ВНИМАНИЕ: Вам нужно скопировать код, который вы получите из вашей панели управления. Код уникален для каждого пользователя PushEngage. Вы не сможете скопировать код из изображения и собирать подписчиков push-уведомлений.

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

<script src="https://clientcdn.pushengage.com/core/02a6e92667ae2279fcba8932356c1d93.js" async></script>
<script> window._peq = window._peq || [];
function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
console.log(res);
}]);
}
</script>

Добавьте этот код в блок HTML в OptinMonster сразу после кода вашей кнопки и между блоком кода <div></div>, и вы закончите!

Шаг № 4: Настройка правил отображения всплывающего окна при намерении уйти

Правила отображения предназначены для определения того, когда ваша кампания появляется на вашем сайте и кто ее видит.

Правила отображения всплывающих окон

Мы рекомендуем установить всплывающее окно для отображения, если обнаружено намерение уйти:

Всплывающее окно lightbox при намерении уйти

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

Нажмите Next Step , чтобы выбрать Action. Здесь мы рекомендуем установить Show the campaign view на Optin View, установить show with MonsterEffect на любую анимацию входа, которую вы хотите, и play sound effect на любой звуковой эффект для вашего всплывающего окна.

Настройки действий кампании

А затем нажмите кнопку Next Step. Вы можете увидеть полный объем ваших настроек на вкладке Summary.

Шаг № 5: Настройка интеграции с электронной почтой

Следующий шаг — настройка интеграции электронной почты. Нажмите «Добавить новую интеграцию» на вкладке «Интеграции» и выберите поставщика услуг электронной почты:

Интеграции OptinMonster

Мы рекомендуем использовать Drip для вашего email-маркетинга, если у вас еще нет поставщика услуг электронной почты.

Шаг № 6: Публикация вашего всплывающего окна при намерении уйти в WordPress

Когда вы создаете новую кампанию, по умолчанию она приостановлена.

Перейдите на вкладку Опубликовать в верхнем меню, чтобы увидеть Параметры публикации. Затем установите статус Опубликовать и выберите платформу веб-сайта:

Опубликовать кампанию OptinMonster

Если у вас сайт на WordPress, плагин OptinMonster автоматически выполнит остальную настройку. То же самое касается Shopify и BigCommerce. Для любого другого сайта нажмите Любой сайт и вставьте код вставки в раздел head вашего веб-сайта:

Глобальный встраиваемый код

И вы закончили!

Что делать после создания всплывающего окна при намерении уйти в WordPress

На этом всё, друзья!

Сообщите нам, помогла ли эта статья. Создание всплывающих окон на вашем сайте может помочь вам превратить трафик в подписчиков электронной почты и реальных бизнес-лидов. И мы настоятельно рекомендуем вам немедленно начать создавать всплывающие окна с намерением выхода.

А если вы ищете доступный способ увеличить трафик, мы рекомендуем использовать push-уведомления. Push-уведомления помогут вам привлечь больше повторных посетителей и повысить вовлеченность на сайте. Вы также можете создавать автоматические кампании push-уведомлений, которые генерируют продажи.

Не убедились? Ознакомьтесь с этими ресурсами:

Мы рекомендуем использовать PushEngage для создания ваших кампаний push-уведомлений. PushEngage — это программное обеспечение для push-уведомлений №1 в мире. Так что, если вы еще этого не сделали, начните использовать PushEngage сегодня!

Добавить комментарий

Мы рады, что вы решили оставить комментарий. Пожалуйста, помните, что все комментарии модерируются в соответствии с нашей политикой конфиденциальности, а все ссылки являются nofollow. НЕ используйте ключевые слова в поле имени. Давайте вести личный и содержательный разговор.

Вовлекайте и удерживайте посетителей после того, как они покинули ваш веб-сайт

Увеличьте ценность каждого посещения веб-сайта с помощью push-уведомлений, которые трудно пропустить.

  • Бесплатный тариф навсегда
  • Простая настройка
  • Поддержка 5 звезд