Лучшие примеры всплывающих окон Elementor имеют три общие черты: одно четкое предложение, триггер, соответствующий тому, что делает посетитель, и таргетинг, который показывает всплывающее окно только там, где ему место. Получите эти три правильно, и всплывающее окно преобразуется примерно в 45% посетителей; получите размещение и триггер вправо, и данные Wisepops показывают, что некоторые форматы достигают 12% и выше.
Каждый приведенный ниже пример работает на бесплатном Elementor. собственный всплывающий инструмент Elementor заблокирован за Pro, но бесплатный Мастер Аддоны Всплывающий конструктор дает вам такое же редактирование перетаскивания, пять триггеров, таргетинг на уровне страницы и библиотеку из более чем 100 всплывающих шаблонов, которые импортируются в один клик. Если вы никогда не создавали ни одного раньше, наше прохождение как добавить всплывающее окно в Elementor бесплатно накрывает установку примерно за десять минут.
25 примеров сгруппированы по целям. каждый показывает реальную сборку, называет подходящий ему триггер и объясняет конкретную причину, по которой он преобразуется. не “popups увеличивает вовлеченность,”, а какой психологический рычаг каждый нажимает.
Оглавление
Что делает всплывающее окно Elementor конвертируемым
Конвертирующее всплывающее окно отвечает на три вопроса, прежде чем посетитель сознательно их задает. Что я получу? Почему сейчас? почему это меня прерывает?
- Одно предложение, одно действие. Всплывающее окно с полем электронной почты и кнопкой превосходит то, которое также связывает ваши социальные сети, вашу продажу и вашу страницу о. Каждый дополнительный выбор обесценивает конверсии.
- Триггер соответствует поведению. Скидка может выстрелить на загрузку страницы. апгрейд контента не может, потому что читатель еще ничего не читал. большинство “popups не работают.” жалобы относятся к правильному предложению на неправильном триггере.
- Нацеливание с учетом контекста. Всплывающее окно для восстановления корзины в блоге - это шум. Показанное только на странице корзины, то же всплывающее окно спасает реальный доход. Условия отображения на уровне страницы - это то, что отличает инструмент преобразования от раздражения.
Цифры обратно вверх.Среднее всплывающее преобразование сидит около 4,65%, но нижне-центральные размещения преобразуют 12,88% в тестировании Wisepops, всплывающие окна с целью выхода обычно восстанавливают 10 (15%) посетителей, которые собирались уйти, а всплывающие окна с двумя шагами превосходят одношаговые, потому что начало действия вызывает у людей желание закончить его (эффект Зейгарника).Каждый пример ниже применяет по крайней мере один из этих рычагов.
Всплывающие примеры поколения потенциальных клиентов
Захват свинца - классическое всплывающее окно. Эти семь превращают читателей в подписчиков, не блокируя контент, за которым они пришли.
1. Всплывающее окно для загрузки электронной книги или контрольного списка
Бесплатный ресурс в обмен на электронную почту. это конвертирует лучше, чем простой “подписка” спрашивать, потому что посетитель уходит с чем-то конкретным, и это соответствует вашему списку. Тот, кто загружает ваш контрольный список оптимизации скорости, заботится об оптимизации скорости. Сжечь это на свиток на 50% так что он приземляется после того, как читатель инвестирован, и нацеливать его только на сообщения блога. библиотека шаблонов Master Addons имеет несколько подписок в стиле загрузки, которые вы можете импортировать в один клик и переформулировать.
2. Согласие на подписку на однопольный информационный бюллетень
Одно поле электронной почты, одна кнопка, одно предложение о том, что получают подписчики. каждое поле, которое вы добавляете, завершает сокращения, поэтому спросите имя позже, внутри приветственного электронного письма. Прокрутите триггер на 40 (60%), только страницы блога и подавьте его в течение нескольких дней после того, как кто-то его удалит. Соедините всплывающее окно с одним из лучшие плагины рассылки WordPress чтобы действительно доставить электронные письма. Всплывающее окно захватывает, ESP отправляет.
3. Обновление контента для конкретных должностей
Наибольшее конвертирование lead popup в большинстве блогов, потому что предложение соответствует точной статье: swipe файл на копирайтинг пост, шаблон на how-to post.Relevance делает убеждение.Target один единственный пост с условиями отображения и запускать его на 80% прокрутка, когда читатель почти закончил и доверяет вам больше всего.Да, это означает сделать один актив на ключевой пост.This также почему это работает: никто больше не беспокоит.
4. Всплывающее окно для вебинара или регистрации событий
События несут встроенный крайний срок, а сроки конвертировать. сохраните форму для имени и электронной почты, покажите дату и время на видном месте, и сделать кнопку сказать “Спасите мое сиденье”, а не “Submit.” Загрузка страницы с задержкой в две-три секунды работает здесь, потому что событие является основным призывом сайта к действию на этой неделе, что делает это единственным случаем, когда прерывание досрочного оправданным.
5. Всплывающее окно с бесплатной пробной версией или демо-запросом
Не нажимайте на всех демо-форму Положите “Забронируйте кнопку демо” в заголовке и откройте форму нажать. Всплывающие окна с кликовым триггером преобразуются с максимальной скоростью среди всех триггеров, потому что посетитель просил их. Каждый человек, который видит форму, хотел ее увидеть, поэтому никто не раздражается, и зацепки приходят теплыми.
6. Разблокировка библиотеки ресурсов
Загрузите коллекцию руководств, шаблонов или контрольных списков за одной регистрацией. воспринимаемая ценность “вся библиотека” превосходит любую отдельную загрузку, поэтому это приносит электронным письмам простое согласие никогда бы не произошло. Используйте триггер щелчка на кнопке “Get access” страницы библиотеки, чтобы поток оставался преднамеренным, и доставьте ссылку разблокировки по электронной почте, чтобы сохранить честность адресов.
7. Выходной магнит
Защитная сетка. Когда курсор движется к панели вкладок, триггер exit-intent делает последнее предложение, и, поскольку посетитель все равно уходил, это не может повредить сеанс, который прерывает.Всплывающие окна выхода обычно восстанавливают 10 — 15% отказа от посетителей, а тесты полноэкранных дизайнов выходов привели к до 50% больше подписок, чем небольшие модальные окна. Ведите с самым сильным магнитом здесь, а не с помощью информационного бюллетеня.
Всплывающие примеры электронной коммерции и WooCommerce
Всплывающие окна в магазинах зарабатывают свое место, когда поднимают среднюю стоимость заказа или спасают продажу. Эти семь подходят для любой сборки WooCommerce. Если вы собираете сам магазин, наш обзор лучшие дополнения Elementor для WooCommerce покрывает виджеты вокруг них.
8. Всплывающее окно со скидкой первого порядка
Рабочая лошадка построения списка электронной коммерции: процент от первого заказа в обмен на электронное письмо. Он конвертируется, потому что обе стороны выигрывают немедленно: покупатель экономит деньги на покупке, которую он рассматривал, вы получаете подписчика стоимостью намного больше, чем скидка. Загрузка страницы на страницах дома и категорий, всегда исключается из корзины и оформления заказа, поэтому вы никогда не сбрасываете со счетов кого-то, кто платил полную цену. Всплывающая библиотека MA поставляет готовые шаблоны скидок; импортируйте один, измените процент, опубликуйте.
9. Подталкивание порога бесплатной доставки
“You're $12 от бесплатной доставки” является машиной средней стоимости заказа: он переосмысливает добавление еще одного товара как экономию денег. покажите его как тонкое всплывающее окно или панель на страницах продуктов с триггером прокрутки и свяжите кнопку прямо с коллекцией бестселлеров по цене, близкой к пробелу. Никакой адрес электронной почты ask it use - это большая тележка, а не больший список.
10. Предложение о выходе из тележки
Около семи из десяти тележек становятся заброшенными, что делает страницу корзины самой высокой ставкой недвижимости в вашем магазине. всплывающее окно с целью выхода там (бесплатная доставка, скидка 5% или просто “твоя ваша тележка сохранена.” успокоение) перехватывает точный момент колебаний. Нацеливайтесь только на страницу корзины. Обстреливаемые по всему сайту, те же регулярные поезда всплывающего окна, которые нужно специально бросить и ждать скидки.
11. Всплывающее окно обратного отсчета распродаж
Срочность работает, когда она реальна Всплывающее окно с загрузкой страницы и живым выступлением таймер обратного отсчета и дата окончания продажи сжимает “Я подумаю об этом” в “решить сейчас.” Правило, которое удерживает его конвертируя долгосрочно: таймер должен сказать правду.Уберите всплывающее окно в ту минуту, когда продажа закончится. Вечнозеленый “ending скоро”, который никогда не заканчивается учит посетителей игнорировать каждый будущий срок, который вы установили.
12. Регистрация на складе
Неакционерная страница обычно означает потерянную продажу. “Notify me” popup с кликом преобразует этот тупик в спрос, который вы можете измерить, и список адресов электронной почты с гарантированным интересом. Эти подписчики конвертируют с необычно высокими ставками, когда пополняется пополнение запасов электронной почты, потому что они просили именно этот продукт. Добавьте класс триггера к кнопке, расположенной там, где обычно находится "Добавить в корзину".
13. Купон раскрывает всплывающее окно
Два шага: посетитель выбирает, затем появляется код Любопытство плюс обязательство: как только кто-то нажимает “Раскройте мой код,” эффект Зейгарника подталкивает их завершить регистрацию, а затем оправдать ее, используя код. Одно честное примечание: колесо с вращением к выигрышу нуждается в отдельном инструменте геймификации; простое раскрытие - это свободный маршрут, и он респектабельно преобразуется без эстетики казино.
14. Всплывающее окно с рекомендациями по конкретной категории
Предложите свой бестселлер кофе-шестерни только в категории кофе Актуальность - это весь трюк: общий “проверьте наши бестселлеры” popup - это реклама, в то время как категория-соответствующая ощущается как помощь продавца Условия отображения Popup Builder обрабатывают таргетинг по категориям, и то же самое Расширение условий отображения вводит идентичные правила страницы и роли в любой другой элемент сайта.
Примеры взаимодействия и всплывающих окон на странице
Не каждое всплывающее окно запрашивает электронное письмо. эти шесть помогают посетителям сделать что-то на странице или узнать больше, не покидая ее. Преобразование здесь означает вовлеченность, воспроизведение видео или ответ на вопрос.
15. Всплывающее окно-лайтбокс видео
Встраивайте демо-видео прямо на страницу, и оно перетаскивает время загрузки вниз независимо от того, смотрит кто-то или нет. Лайтбокс с кликом переворачивает это: страница остается быстрой, и видео открывается в чистом наложении для посетителей, которые его выбирают. миниатюра кнопки воспроизведения преобразует щелчки лучше, чем текстовая ссылка, потому что она задает ожидание того, что именно произойдет дальше. Библиотека MA включает шаблоны видеолайтбоксов, готовые к импорту; поменяйте URL-адрес видео, и все готово.
16. Лайтбокс галереи изображений
Миниатюры открывают полноразмерные изображения в модале Для портфолио и крупных планов продукта это разница между посетителем, щурящимся на сетке и фактически проверяющим работу Время, потраченное на проверку, коррелирует с запросами. Нажмите на триггер на каждом миниатюре, и сохраните модальный хром минимальным, чтобы изображение продавало.
17. Новая панель объявлений
Тонкая полоса загрузки страниц в верхней части экрана указывает на обновление, новую страницу или запуск без покрытия контента. Поскольку он не требует принятия решения, уровень увольнений остается низким, и сообщение просматривается на разных сеансах. Запуск чего-то большего? Соедините бар с правильным Элементор скоро появится на странице для окна перед запуском пусть панель объявит о выпуске.
18. Всплывающее окно микрообследования обратной связи
Один вопрос, два-пять кликабельных ответов, уволены после бездействия. Время - это понимание: посетитель, который сделал паузу, что-то обрабатывает, может быть, путаница, может быть, колебания, и опрос из одного вопроса ловит это, пока это происходит. Держите его на одном касании без формы для последующих действий или уровень ответов падает.
19. Возраст или ворота контента
Полноэкранное всплывающее окно с загрузкой страницы, которое блокирует контент до тех пор, пока посетитель не подтвердит свой возраст. Требуется алкоголь, вейпинг, некоторые ниши здоровья и определенный регулируемый контент. Конвертация здесь означает соответствие требованиям без потери посетителя: две четкие кнопки, стиль бренда, чтобы он не выглядел как законная засада, и перенаправление на путь несовершеннолетних. Зажигайте его один раз за сеанс, а не на каждом просмотре страницы.
20. Подробный модал "нажми и открывай"
Ценовые примечания, спецификации, условия доставки, руководства по размеру: контент, который имеет значение для 10% посетителей и загромождает страницу для остальных 90%. поместите его за ссылку “View Details”, которая открывает модал. макет остается чистым, искатели деталей получают ответы без перезагрузки страницы, а ваш главный призыв к действию сохраняет свою направленность.
Всплывающие примеры полезности и соответствия требованиям
Эти пятеро справляются с практическими работами, которые в конечном итоге нужны каждому сайту. Они редко что-то продают, но плохо справляются с ними, они обходятся вам в счет посетителей, поэтому они тоже конверсионные работы.
21. Уведомление о согласии на использование файлов cookie
Небольшая полоса загрузки страниц, которая записывает согласие и держится подальше от дороги. внизу экрана, две кнопки, нет полноэкранного поглощения.Стены согласия, которые блокируют страницу, повышают частоту отскоков до того, как посетитель прочитает слово. Создайте его в соответствии с сайтом, чтобы он читался как часть дизайна, а не как законный виджет, закрепленный болтами.
22. Вход или регистрация по модальному стандарту
Открыть вход в систему при нажатии на модал вместо маршрутизации на отдельную страницу входа в систему Меньше загрузок страниц означает меньше выпадающих средних потоков, что имеет наибольшее значение на сайтах членства и в магазинах, где вход находится между посетителем и кассой Шаблоны входа в библиотеку поставляются в предварительном стиле; импортируйте, подключайте форму, сделано.
23. Местоположение или выбор валюты
Попросите посетителей, впервые посетивших выбрать регион или валюту при загрузке страницы, затем помните выбор. показ правильных цен и условий доставки заранее предотвращает самый отвратительный убийца конверсии в международной электронной коммерции: сюрприз при оформлении заказа. Пожар один раз только для новых посетителей; повторные посетители уже ответили.
24. Всплывающее окно с формой назначения или бронирования
Для клиник, салонов, консультантов и всех, кто продает время: всплывающее окно с кликом, содержащее форму бронирования, означает, что каждая кнопка “Book now” на сайте открывает одну и ту же форму, не поддерживая отдельную страницу бронирования на услугу. Меньше шагов между намерением и назначением, а также одна форма для обновления при изменении доступности.
25. Подталкивание к повторному взаимодействию
Сообщение после бездействия, которое возвращает отвлеченного посетителя до закрытия вкладки. Другая работа, чем намерение выхода: выход ловит активное решение уйти, бездействие ловит внимание, которое переместилось в другое окно. Нежный “Все еще решает? Вот наш самый популярный вариант” перезапускает сеанс чаще, чем вы ожидаете, и это ничего не стоит вовлеченному посетителю, потому что он никогда его не видит.
Сопоставляйте каждое всплывающее окно с правильным триггером
Предложение решает триггер. Мастер Аддоны поставляет пять, и выбор неправильного является наиболее распространенной причиной, по которой хорошее всплывающее окно неэффективно. Эта таблица отображает триггеры в приведенные выше примеры.
| Триггер | Пожары когда | Лучший пример подгонки | Остерегайтесь |
|---|---|---|---|
| На Нажать | Посетитель щелкает заданный элемент | Демо-запрос (5), видеолайтбокс (15), форма бронирования (24) | Для подключения необходима кнопка или ссылка |
| На Прокрутка | Страница прокручивается на установленный процент | Обновление контента (3), подписка на рассылку новостей (2) | Установите его слишком низко, и он сработает до того, как появится интерес |
| Загрузка страницы | После задержки вы установили | Баннеры продажи (11), уведомление об использовании файлов cookie (21), возрастные ворота (19) | Менее двух секунд имеет тенденцию раздражать |
| Выход Намерение | Курсор перемещается, чтобы закрыть вкладку | Восстановление тележки (10), ведущий магнит последнего шанса (7) | Настольный сигнал слабее на мобильном телефоне |
| После бездействия | Прокрутка и остановка движения | Опрос обратной связи (18), подталкивание к повторному вовлечению (25) | Продолжайте ждать достаточно долго, чтобы чувствовать себя естественно |
Как построить любой из этих всплывающих окон бесплатно
Сборка одинакова для всех 25 примеров.Установите бесплатный плагин Master Addons поверх бесплатного Elementor, откройте Master Addons → Popup Builder и добавьте новое всплывающее окно.
- Начните с библиотеки, а не с чистого холста. The библиотека шаблонов содержит более 100 всплывающих окон: подписки, скидки предложения, видео лайтбоксы, уведомления о файлах cookie, формы входа в систему. Найдите тот, который соответствует вашему примеру и он импортирует в один клик, полностью редактируемый.
- Редактировать с помощью обычных виджетов Elementor. Текст, форма, изображение, обратный отсчет: всплывающее полотно работает точно так же, как страница.
- Выберите спусковой крючок из стола выше. Один переключатель на триггер с задержкой, процентом прокрутки или настройкой класса CSS.
- Установить условия отображения. Весь сайт, конкретные страницы или конкретные посты. это шаг таргетинга, который большинство людей пропускают, а затем задаются вопросом, почему всплывающее окно раздражает людей или никогда не показывает.
Полное прохождение со скриншотами находится в нашем руководстве как добавить всплывающее окно в Elementor бесплатно.
Один честный предел: всплывающий конструктор захватывает потенциальных клиентов и показывает предложения, но это не платформа электронной почты или пакет тестирования A/B. Если вам нужно сплит-тестирование и глубокая аналитика, соедините его со специальным инструментом; наше сравнение лучшие плагины для создания всплывающих окон для WordPress карты той территории. для дизайнерского вдохновения за пределами этих 25, собственных у Элементора всплывающие примеры стоят прокрутки, и бесплатный плагин включен Каталог WordPress когда готов строить.
Часто задаваемые вопросы
Как мне создать всплывающие окна в Elementor?
Свободный Элементор не имеет встроенного всплывающего конструктора, поэтому вы добавляете его с плагином.Установите бесплатные Главные Аддоны для плагина Элементор, перейдите в Мастер Аддоны, Всплывающий конструктор, нажмите Добавить новое, спроектировать всплывающее окно с виджетами Элементор, выберите триггер, установите условия отображения, и опубликовать. поток занимает менее десяти минут.
Как я могу создать всплывающее окно в Elementor бесплатно?
Используйте бесплатный Master Addons Popup Builder. он работает на бесплатной версии Elementor, включает пять триггеров и более 100 шаблонов и никогда не запрашивает лицензию Pro для создания, запуска или нацеливания всплывающего окна. Elementor Pro нужен только в том случае, если вместо этого вам нужен собственный Popup Builder от Elementor.
Как запустить всплывающее окно Elementor при нажатии кнопки?
Установите всплывающий триггер в Нажать и введите CSS класс, такой как open-popup Затем добавьте тот же класс в виджет кнопки в разделе Расширенные, CSS Классы Каждая кнопка с этим классом открывает всплывающее окно, и тот же метод работает для изображений, значков и ссылок.
Существуют ли бесплатные всплывающие шаблоны Elementor?
Да. всплывающая библиотека Master Addons поставляет более 100 шаблонов внутри бесплатного плагина, охватывающих подписки, баннеры продаж, видео-лайтбоксы, уведомления о файлах cookie и формы входа в систему. Каждый импортируется одним щелчком мыши и остается полностью редактируемым в Elementor, без пробного ограничения или водяного знака.
Почему не отображается мое всплывающее окно Elementor?
Обычная причина - отсутствие условий отображения Всплывающее окно с правилом отсутствия включения никогда не появляется на передней панели, даже если оно выглядит прямо в редакторе.Откройте всплывающие настройки, добавьте условие отображения, такое как "Весь сайт" или конкретная страница, сохраните и протестируйте на обычной вкладке браузера, а не в предварительном просмотре редактора.
Связанное чтение
