Пропустить

JetPopup или Elementor Popup Builder: какой из них вы выбираете?

Divi: самая простая тема WordPress для использования

Divi: Лучшая тема WordPress всех времен!

Более Загрузка 600.000, Divi - самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуется]

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

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

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

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

Два потрясающих плагина, созданные специально для Elementor Page Builder, помогут вам создавать всплывающие окна всех типов, форм и стилей, которые вам нужны - Elementor Popup Builder et JetPopup, Поскольку они оба сделаны из той же плоти, что и Elementor, единственный вопрос, который нужно задать, - какой из этих плагинов выбрать. Чтобы помочь вам принять это решение, я сделаю тщательный обзор обоих, и вы сможете сравнить их преимущества и недостатки. Итак, поехали!

Загрузка и установка

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

Popup Builder

Факир

Этот плагин был создан командой Elementor. Таким образом, мы могли бы назвать его его настоящим "ребенком". Это последнее обновление Elementor, запущенное в январе 2019 для удовлетворения потребностей клиентов. Тем не менее, он не доступен пользователям бесплатной версии Elementor.

Popup Builder включен в план профессиональной подписки. Итак, чтобы иметь возможность создавать всплывающие окна, вы должны сначала иметь Elementor Pro. Простейший тарифный план, позволяющий использовать все возможности Elementor для одного веб-сайта, стоит $ 49 в год. Таким образом, с первых шагов (покупка Elementor Pro), вот алгоритм получения Popup Builder:

  • Купить Pro Elementor Page Builder.
  • Зайдите в личный кабинет и загрузите плагин.
  • Перейдите на панель инструментов вашего сайта, Плагины> Добавить новый, нажмите кнопку «Загрузить плагин» и выберите соответствующий файл .zip.
  • После завершения установки активируйте плагин с помощью лицензионного ключа.
  • Вот Конструктор всплывающих окон находится на вкладке Шаблоны> Всплывающие окна.

Это долгий путь, но с Popup Builder вы также получаете огромную коллекцию различных элементов Elementor, таких как виджеты, шаблоны и другие дополнительные инструменты.

Popup Builder

JetPopup

«Семейство» плагинов Jet уже содержит больше статей 10, и JetPopup - одна из них. Он был тщательно создан специально для Elementor и увеличивает количество доступных инструментов. Этот плагинJetPopupsполностью совместим с бесплатными и платными версиями. Вам не нужно совершать дополнительные покупки. JetPopup стоит 15 $, и как только вы его получите, вы можете использовать его для одного веб-сайта. Если он вам нужен для более чем одного проекта, вы можете купить плагин по лицензии разработчика (он будет стоить 45 $) и использовать его для пяти веб-сайтов. Алгоритм получения плагина немного проще:

  • Купите плагин на Торговой площадке TemplateMonster. Он будет загружен на ваш компьютер.
  • Перейдите на панель инструментов вашего сайта, Плагины> Добавить новый, нажмите кнопку «Загрузить плагин» и выберите соответствующий файл .zip.
  • После завершения установки активируйте плагин.
  • Вуаля! Когда вы откроете меню настройки Elementor (нажав кнопку «Редактировать с помощью Elementor»), вы увидите раздел JetPopup в левом меню виджета.

JetPopup

Создание всплывающих окон

Теперь, когда инструменты готовы и готовы, я могу попытаться создать всплывающее окно с обоими плагинами и посмотреть, насколько проста и понятна эта функция. Далее я создам основное всплывающее окно и рассмотрим параметры настройки для Popup Builder и JetPopup.

Popup Builder

В Pro Elementor всплывающие окна делаются отдельно от страниц сайта. Чтобы изменить внешний вид сайта, откройте страницу для настройки, нажмите кнопку «Редактировать с помощью Elementor» и внесите изменения. Но чтобы создать (а затем отредактировать) всплывающие окна, вам нужно перейти в «Шаблоны»> «Всплывающие окна» и нажать кнопку «Добавить новое всплывающее окно».

Popup Builder
Попробуйте Popup Builder прямо сейчас

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

создание всплывающих окон

Вы ищете лучшие темы и плагины WordPress?

Загрузите лучшие плагины и темы WordPress на Envato и легко создайте свой сайт. Уже больше, чем 49.720.000. [ЭКСКЛЮЗИВ]

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

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

Я выбрал одну из моделей, отображаемых вверху списка библиотек. Сразу после выбора вы попадаете на рабочее поле Elementor, к которому вы, вероятно, привыкли. Параметры настройки находятся на боковой панели в левой части экрана. У вас есть три вкладки здесь.

Вкладка «Настройки» позволяет изменить макет всплывающего окна, изменить название модели и превью. На вкладке «Стиль» вы можете настроить дизайн - изменить цвета, шрифты, изображения и границы. На вкладке «Дополнительно» также есть набор дополнительных ползунков; например, они предотвращают закрытие всплывающего окна клавишей ESC.

настройки всплывающих окон

Как видите - ничего неожиданного, если вы уже использовали Elementor, у вас не возникнет никаких проблем с этим плагином. Вот подробное видео, которое объясняет, как создать всплывающее окно с помощью Popup Builder:

JetPopup

Этот плагин также добавляет новую вкладку на панель инструментов WordPress тема и с его помощью всплывающие окна также создаются отдельно от страниц. Готовые всплывающие окна также хранятся на вкладке «Библиотека всплывающих окон». Чтобы создать новое всплывающее окно, вы можете либо нажать кнопку «Добавить» в предопределенном шаблоне, либо перейти в JetPopup> Добавить новое всплывающее окно, дать назовите модель и нажмите «Редактировать с помощью Elementor».

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

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

всплывающие элементы

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

всплывающая кнопка действия

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

Не так просто открыть настройки всплывающего окна. Вы должны нажать кнопку обслуживания в нижней части меню. Меню настроек очень похоже на Popup Builder, но есть только две вкладки для настройки. «Общие настройки» позволяет определить эффект анимации, переименовать модель или задать условия. На вкладке «Стиль» вы можете изменить макеты, цвета, изображения, шрифты и границы.

общие настройки всплывающего окна

JetPopup имеет чуть менее очевидную функциональность, но компенсирует это подробными и полезными видеоуроками.

триггеры

Чтобы быть полезными и не раздражать посетителей, всплывающие окна должны появляться в нужное время. Условия, при которых отображается всплывающее окно, называются «триггерами». Чем более детализированы доступные условия, тем более гибким является всплывающий плагин. Точность очень важна, если вы не хотите, чтобы ваш пользователь покинул сайт после появления всплывающего окна формы подписки.

Popup Builder

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

Легко создайте свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным дизайном. Прекратите платить дорого за то, что вы можете сделать сами. [Free]

опубликовать всплывающее окно

Этот плагин поможет вам определить необходимые условия сразу после настройки всплывающего окна. Когда вы нажимаете кнопку «Опубликовать», вы видите окно, в котором вы можете определить условия (на каких страницах будет отображаться это всплывающее окно), триггеры (когда будет отображаться всплывающее окно) и расширенные правила.

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

JetPopup

настройки всплывающих окон

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

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

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

позиционирование

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

позиционирование

Popup Builder et JetPopup разделите экран на девять областей и позвольте разместить всплывающее окно в любой из них. Позиционирование определяется по шкале слева-справа и вверх-вниз. Это не очень гибко, но этого достаточно для всплывающего окна.

Анимационные эффекты

То, как окно скользит (или катится или прыгает) на странице, очень важно. Если окно движется слишком быстро или слишком медленно, оно не будет эффективным. Отскок, щекотка и тремор также должны использоваться с большой точностью Анимационные эффекты делают сайт более динамичным, но они также могут испортить все впечатление.

Анимационные эффекты

Popup Builder 36 имеет входные типы анимации, включая различные типы перетаскивания, развертывания, масштабирования, отскока и поворота в разных направлениях. Все это, а также продолжительность анимации, можно найти в разделе «Макет» на вкладке «Настройки».

настройки всплывающих окон

В плагине есть типы анимации 13 JetPopup, в том числе затухания, вертикальное переворачивание, различные слайды, подпрыгивание и масштабирование. Вы найдете их в разделе «Настройки» на вкладке «Настройки».

модели

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

Легко создайте свой интернет-магазин

Загрузите бесплатные WooCommerce, лучшие плагины для электронной коммерции, чтобы продавать свои физические и цифровые продукты в WordPress. [FREE]

Библиотека моделей Elementor

Popup Builder добавили категорию в библиотеку моделей Elementor. Как я уже говорил вам, вы можете увидеть это с самого начала нового процесса создания всплывающего окна. Ассортимент всплывающих шаблонов достаточно велик; Есть больше, чем статьи 100. В верхнем левом углу раскрывающийся инструмент сортировки позволяет ускорить поиск. Категории понятны, и вам не понадобится много времени, чтобы найти нужное вам всплывающее окно.

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

JetPopup Также есть огромная библиотека моделей. Все они хранятся на вкладке «Контекстная библиотека» и имеют удобные функции, такие как кнопка предварительного просмотра и счетчик использования. Есть больше вариантов сортировки, список может быть настроен для отображения определенного типа шаблонов, а затем размещен в любом порядке; например, в зависимости от даты создания. Я не могу сказать вам точное количество доступных моделей, но их, безусловно, больше, чем 100.

Сравнительная таблица

Elementor Popup BuilderJetPopup
Цена45 $15 $
модели100+100+
триггерыТриггеры 6, расширенные правила 75 открытые события с дополнительными параметрами
Animatio36 виды13 виды
Учебникидокументациидокументация, видеоуроки 9

JetPopup vs Popup Builder

Вывод

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

Эта статья содержит комментарии 0

Оставить комментарий

Ваш электронный адрес не будет опубликован. Обязательные для заполнения поля помечены *

Этот сайт использует Akismet для уменьшения нежелательности. Узнайте больше о том, как используются ваши комментарии.

Вверх
1 акции
доля1
чирикать
Регистрация