Плагины всплывающих окон WordPress: хорошие, плохие и уродливые

Всплывающие окна, вы наверняка видели их на многих веб-сайтах. Это окна, которые появляются на сайте, когда вы читаете статью или пытаетесь выйти. Их основная цель — расширить список адресов электронной почты компании (т. е. привлечь потенциальных клиентов).

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

Потому что они являются хорошим инструментом лидогенерации, если их использовать с умом.

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

Посмотрите на это: коэффициент конверсии 3,62% для всплывающего окна, появляющегося через 8 секунд, по сравнению с 0% (что означает отсутствие всплывающего окна). Это определенно что-то значит, верно?

Теперь в этой статье мы поговорим о:

• Лучшие всплывающие плагины для WordPress;
• Анатомия поп-апа;
• Лучшие примеры использования всплывающих окон;
• Всплывающее вдохновение.

А не ___ ли нам?

Лучшие плагины для всплывающих окон WordPress

Теперь, когда вы начинаете искать плагин всплывающих окон для WordPress, соответствующий вашим потребностям, вот некоторые функции, которые могут пригодиться:

• Доступны предварительно разработанные шаблоны, так что вам не всегда нужно начинать с нуля или если вам нужно вдохновение;
• Конструктор всплывающих окон с помощью перетаскивания, чтобы вы могли создавать все быстро и легко, без кода;
• Интеграция с почтовым маркетингом: убедитесь, что ваш плагин WordPress для всплывающих окон легко интегрируется с вашим поставщиком услуг электронной почты.
• Множество доступных триггеров для вашего всплывающего окна: намерение выхода, основанное на времени, проведенном на странице, географии, вернувшихся и новых посетителях и т. д.;

Теперь давайте взглянем на 5 лучших плагинов для всплывающих окон WordPress в экосистеме:

ОптинМонстр

В настоящее время используется более чем 1 213 400 веб-сайтами, это автономный продукт SaaS. У них также есть плагин WordPress с более чем 1 000 000 активных установок.

Вот некоторые из его наиболее ценных особенностей:

• Доступны различные форматы всплывающих окон: лайтбокс, плавающие полосы, слайды, игровые вращающиеся колеса, таймеры обратного отсчета и многое другое;
• Перетащите конструктор всплывающих окон WordPress;
• Готовые шаблоны всплывающих окон;
• Множественные персонализации на основе поведения: намерение выхода, геолокация, ретаргетинг и многое другое;
• А/В тестирование всплывающих окон;
• Анимации и звуковые эффекты;
• Интеграция с самыми популярными плагинами форм WordPress ;
• Интеграция с почтовым маркетингом (Mailchimp, Sendinblue, ConvertKit, Drip, Klaviyo и многие другие);

Цены : от 9 долларов в месяц, оплачивается ежегодно для базового плана.

PopupMaker

Этот плагин всплывающих окон для WordPress используется на более чем 600 000 сайтов и очень популярен. Вот некоторые из его наиболее ценных особенностей:

• Интеграция с наиболее популярными плагинами форм WordPress (Ninja Forms, Gravity Forms, Contact Form 7 и т. д.) ;
• Интеграция с почтовым маркетингом (Mailchimp, GetResponse, Hubspot и многие другие);
• Таргетинг на любой контент WordPress, такой как посты, страницы и многое другое;
• всплывающее расписание ;

Цена : от 87 долларов в год для плана Start.

Суетиться

Этот всплывающий плагин WordPress используется на более чем 100 000 сайтов и создан WPMU DEV. Они стоят за многими популярными плагинами WordPress.

Вот некоторые из наиболее ценных функций Hustle:

• Шаблоны для различных вариантов использования (например, Черная пятница, раздача подарков, уведомление о COVID, подписка на новостную рассылку);
• Полностью отзывчивые всплывающие окна;
• Доступно множество вариантов стилей , от границ, теней, интервалов, типографики, цвета до пользовательского CSS;
• Множество поведенческих триггеров , таких как время на странице, прокрутка, намерение выхода и многое другое.
• Интеграция с почтовым маркетингом (Mailchimp, Sendinblue, ConvertKit, Drip, Klaviyo и многие другие);

Цена : 5 долларов США в месяц, оплачивается ежегодно для плана Hustle Pro. Доступна бесплатная пробная версия.

Сумо

Sumo — это плагин WordPress, который помогает более чем 60 000 веб-сайтов расширять свой список адресов электронной почты с помощью всплывающих окон. Как и OptinMonster, он также работает как отдельный продукт. Помимо WordPress, он поддерживает еще больше веб-сайтов.

Вот некоторые из его наиболее важных особенностей:

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

Ценообразование : ребята из Sumo хвастаются тем, что вы можете использовать Sumo БЕСПЛАТНО и платить только тогда, когда у вас появляется больше клиентов.

Пакет PRO начинается с 39 долларов США в месяц при ежегодной оплате.

КонвертироватьПро

Convert Pro — наш выбор для создания всплывающих окон WordPress. Он действительно гибкий и имеет множество вариантов дизайна и запуска.

Вот функции, которые нам нравятся:

• Перетащите редактор ;
• Мобильная отзывчивость ;
• Многошаговые всплывающие окна;
• Множество вариантов запуска;
• Огромная библиотека шаблонов;
• Доступно множество форматов всплывающих окон: с намерением выйти, по щелчку, информационные панели, слайды, встроенные CTA, полноэкранные CTA, преобразование ковриков и многое другое.
• Простое A/B-тестирование;
• Интеграция с почтовым маркетингом (Mailchimp, Sendinblue, ConvertKit, Drip, Klaviyo и многие другие);

Цена : от 79 долларов в год.

Как создать всплывающее окно WordPress с помощью ConvertPro

Пришло время перейти к демонстрации, не так ли?

Поскольку мы являемся пользователями Convert Pro, я собираюсь показать вам, как мы используем этот инструмент здесь, в Colibri.

Вот шаги для создания всплывающего окна WordPress с помощью Convert Pro:

1. После покупки плагина зайдите в магазин BrainStormForce (создатели плагина) и загрузите zip-файл с помощью Convert Pro . Теперь перейдите в панель управления WordPress -> Плагины -> Добавить новый. Загрузите сюда свой zip-файл, затем активируйте плагин.
2. Перейдите на панель инструментов WordPress -> Convert Pro -> Create New.
3. Выберите желаемый тип всплывающего окна WordPress .
4. Выберите шаблон и цель.
5. Назовите свое всплывающее окно и нажмите «Создать».
6. Начните создавать всплывающее окно . Добавьте к нему заголовки, абзацы, визуальные эффекты. В меню слева вы можете выбрать несколько форм и форматов кнопок. Вы даже можете добавить обратный отсчет, например, если вы проводите рекламную акцию. Внутри опции «Панель» вы можете настроить размер всплывающего окна, добавить анимацию, фон и многое другое. Вы также можете стилизовать свою форму так, как вам нравится. Вы также можете создавать многошаговые всплывающие окна в дополнительных параметрах. Вы можете предварительно просмотреть мобильную версию всплывающего окна, щелкнув значок мобильного устройства в верхней части панели управления.
7. Настройте свою форму . На этом уровне вы можете выбирать из множества триггеров. В меню «Цель» вы можете настроить параметры на основе геолокации, устройства и других действий пользователя. Например, мне нравится создавать отдельные всплывающие окна для мобильных устройств и компьютеров. На мобильных устройствах я запускаю всплывающие окна WordPress через 5 секунд, а на рабочем столе я использую выход с намерением.
8. Подключите Convert Pro к сторонним инструментам , таким как формы и программное обеспечение для маркетинга по электронной почте.
9. Не забудьте сохранить и «сделать общедоступным» ваше всплывающее окно WordPress, как только вы закончите.

И это все. У вас есть первое всплывающее окно WordPress!

Теперь, когда вы знаете, как создать всплывающее окно, давайте рассмотрим его обязательные элементы.

Анатомия всплывающего окна

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

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

Итак, вот элементы всплывающего окна:

• Форма . Эти формы могут быть очень простыми, только с кнопкой призыва к действию, или могут иметь несколько дополнительных настраиваемых полей.
• Триггер . Эти всплывающие окна могут появляться в зависимости от поведения веб-сайта или пользователя, например: после 8 секунд на странице, после 70% прокрутки, когда пользователь намеревается покинуть веб-сайт и т. д.
• Таргетинг . Вы можете запускать эти всплывающие окна для отображения в зависимости от геолокации посетителя, типа страницы, на которой он находится, и т. д. Возможно, посетитель читает статью о здоровом питании. Вы можете показать ему всплывающее окно, рекламирующее вашу электронную книгу с рецептами бодрящих смузи. Настройка имеет ключевое значение, если вы хотите максимизировать коэффициент конверсии.
• Индивидуальные элементы дизайна, которые помогут вам передать ваше сообщение или сделать его более привлекательным: изображения, видео и т. д.

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

Теперь давайте рассмотрим несколько хороших способов создания всплывающих окон с высокой конверсией.

Лучшие примеры использования всплывающих окон

Я буду краток и мил. Вот так:

• Не будьте навязчивы со своими всплывающими окнами. Будьте мудры со своими триггерами. Я всегда выбираю намерение выхода, чтобы не сильно мешать работе пользователя.
• Не показывать всплывающие окна на всех ваших страницах. Подумайте о цели вашей страницы. Вы действительно хотите показывать всплывающее окно на страницах цен или контактов? Будьте мудры в этом.
• Убедитесь, что ваше всплывающее окно хорошо отображается на всех устройствах.
• Сделайте так, чтобы посетителям сайта было легко закрыть всплывающее окно.
• Используйте изображения во всплывающих окнах. Анализ Sleeknote показал, что они конвертируются лучше, чем без изображений.
• Вызовите FOMO (страх упустить) во всплывающем окне. Например, вы можете сделать это, вставив таймер обратного отсчета, сообщающий людям, сколько дней осталось до окончания вашей акции.
• Чем больше полей в форме, тем меньше конверсий. Будьте осторожны, как вы балансируете эти вещи. С одной стороны, несколько полей формы могут помочь вам лучше сегментировать потенциальных клиентов.
• Определите цели и цель использования того или иного всплывающего окна.
• Внедрите всплывающие окна по времени для лучшего взаимодействия.
• Попробуйте сегментировать всплывающие окна для новых посетителей и повторных посетителей.
• Когда пользователи прокручивают ваш контент или тратят больше времени на статью, это означает, что вы привлекли их внимание. Как насчет использования триггера прокрутки, чтобы показать им всплывающее окно с обновлением контента или приглашением на вебинар?

7 примеров всплывающих окон, которые вас вдохновят

Теперь, хватит с теорией, давайте посмотрим на некоторые реальные всплывающие окна.

Пример всплывающего окна 1: Sleeknote

Это всплывающее окно Sleeknote использует социальное доказательство, чтобы попытаться убедить людей подписаться на их информационный бюллетень. Когда вы зарегистрируетесь, вы присоединитесь к другим 70 000 маркетологов.

И поскольку некоторые люди могут испытывать усталость от информационных бюллетеней, они используют термин «еженедельное маркетинговое вдохновение». Sleeknotes также «подкупает» своих посетителей пожизненным доступом к ресурсам клиентов в обмен на подписку. Они также используют гифку и смайлик, чтобы сделать всплывающее окно более привлекательным.

Пример всплывающего окна 2: Hubspot

В приведенном ниже примере у нас есть всплывающее окно с намерением выйти из Hubspot (программное обеспечение для маркетинга и продаж), которое пытается убедить посетителей своего веб-сайта подписаться на их информационный бюллетень. Они также используют социальное доказательство, чтобы быть более убедительными: уже присоединились более 600 000 маркетологов.

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

Пример всплывающего окна 3: Haute Hijab

Этот многомиллионный магазин электронной коммерции использует всплывающее окно, которое предлагает 15% скидку посетителям, подписавшимся на информационный бюллетень.

Пример всплывающего окна 4: Backlinko

У Брайана Дина, известного эксперта по SEO, есть заблокированный контент в блоге. Это действительно ценный пример, которым он готов поделиться со своими читателями в обмен на их электронную почту.

Когда вы нажимаете кнопку «Разблокировать сейчас», вы запускаете всплывающее окно.

Пример всплывающего окна 5: Mailpoet

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

Пример всплывающего окна 6: Virgin Atlantic

Virgin Atlantic использует всплывающую информационную панель, чтобы информировать пассажиров о мерах безопасности в связи с COVID-194.

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

Пример всплывающего окна 7: Дедолес

Попробуйте зацепить посетителей сайта секретными бонусами. Ребята из Dedoles используют для этого призовое колесо. В обмен на вашу электронную почту вы получите скидку или подарок.

Подведение итогов

Моргни дважды, если ты все еще со мной

А теперь давайте посмотрим, что мы сегодня узнали:

• Каковы 5 лучших плагинов для всплывающих окон WordPress в экосистеме;
• Как использовать ConvertPro для создания всплывающих окон WordPress;
• Какие элементы всплывающего окна;
• Каковы лучшие практики, которые вы можете использовать для создания всплывающих окон WordPress, которые конвертируют;

Это все люди!

Если вам понравилась эта статья, и вы хотите узнать больше о том, как создать веб-сайт на WordPress , обязательно подпишитесь на канал Colibri на Youtube и следите за нами в Twitter и Facebook!

Хотите дать толчок своему бизнесу?

Получайте раз в два месяца обновления:

• создание потрясающих веб-сайтов WordPress
• создание присутствия в Интернете
• продвижение вашего сайта

Адрес электронной почты:

Отметьте, если вам больше 18 лет и вы хотите получать эксклюзивные подарки, новости о WordPress и наших продуктах по электронной почте. Вы можете отменить подписку в любое время. Ознакомьтесь с нашей Политикой конфиденциальности и Условиями использования для получения дополнительной информации.