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

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

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

Картинку для попапа можно загрузить с компьютера, взять из своих файлов или сгенерировать через AI, описав словами, что нужно. Дальше вы показываете, какая часть картинки главная: товар, лицо или надпись, — и выбираете форму кадра: квадрат, фото или широкий кадр. Картинка подстраивается сама, и обрезать её заранее в другой программе больше не нужно.

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

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

Если на телефоне нужна фраза короче, соберите два текста: длинный покажите только на компьютере, короткий — только на телефоне. Каждый посетитель увидит свою версию, а попап останется одним.

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

Новый редактор уже работает в каждом попапе — откройте любой из них. Подробности есть в статьях «Панель настроек», «Текст: стиль, размер и выравнивание» и «Мобильная версия попапа».

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