WordPress модальное окно: 20 лучших всплывающих и встроенных плагинов WordPress

7 плагинов для легкого добавления модального окна в WordPres

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

 

Popup Maker

Popup Maker — преемник Easy Modal, является, пожалуй, самым популярным модальным оконным плагином WP, и это по причине — он полон функций. С его помощью вы можете создавать отзывчивые формы отказа, слайд-баннеры, баннеры, плавающие стикеры, уведомления, загрузочные экраны и лайтбоксы видео. Этот плагин работает с наиболее популярными плагинами для создания форм (такими как Ninja Forms, Gravity Forms и Contact Form 7) и программ для создания списков (таких как MailChimp, AWeber, InfusionSoft, GetResponse и т. д.). Плагин предлагает много с точки зрения конфигурации. Благодаря триггерам и условиям вы можете точно настроить, кто и когда видит ваши модалы. У вас также есть модуль статистики, поэтому вы знаете, какие из ваших всплывающих окон работают лучше всего.

 

Popup Builder

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

 

Popups — WordPress Popup

Если по какой-то причине вам не нравятся Popup Maker и Popup Builder и вы ищете всплывающий плагин с множеством функций, вы можете попробовать Popups — WordPress Popup . Он работает со всеми основными программами для создания форм, такими как Gravity Forms, Ninja Forms, Contact form 7 и более, но его главное преимущество — многочисленные фильтры, которые он предлагает. Благодаря этим фильтрам вы можете точно настроить, когда, где и как отображаются ваши всплывающие окна. Платная версия включает в себя больше (например, интеграция с MailChimp, Aweber и другими почтовыми программами, A / B-тестирование, больше правил отображения и т. д.).

 

Modal Window

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

 

Popup by Supsystic

Popup by Supsystic — отличный выбор, если у вас много мобильных посетителей, потому что он поставляется с тридцатью готовыми для мобильных устройств всплывающими шаблонами. Как и в случае с другими модальными оконными плагинами, этот предлагает триггеры, условия и функции настройки. Он также предлагает некоторые не очень распространенные функции для бесплатного плагина, такие как всплывающие окна в социальных сетях, блокировки ссылок или A/B-сплит-тестирование.

 

Exit Popup

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

 

SMNTCS Shortcode Popup

SMNTCS Shortcode Popup — еще один маленький и приятный плагин, который вы можете использовать в основном для всплывающих окон контактной формы. Плагин хорошо работает с Contact Form 7, Gravity Forms, TablePress и т. д., Как и в предыдущем плагине, он делает только одно, но делает это хорошо.

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

Плагин для WordPress всплывающее окно с акцией, модальное окно для WordPress

ПОЛИТИКА КОНФИДЕНЦИАЛЬНОСТИ ПЕРСОНАЛЬНЫХ ДАННЫХ

Настоящая Политика конфиденциальности персональных данных (далее – Политика конфиденциальности) действует в отношении всей информации, которую сайт Сайтогон, (далее – Сайт) расположенный на доменном имени sitogon.ru (а также его субдоменах), может получить о Пользователе во время использования сайта sitogon.ru (а также его субдоменов), его программ и его продуктов.

1. Определение терминов

1.1 В настоящей Политике конфиденциальности используются следующие термины:

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

1.1.2. «Персональные данные» — любая информация, относящаяся к прямо или косвенно определенному, или определяемому физическому лицу (субъекту персональных данных).

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

1.1.4. «Конфиденциальность персональных данных» — обязательное для соблюдения Оператором или иным получившим доступ к персональным данным лицом требование не допускать их распространения без согласия субъекта персональных данных или наличия иного законного основания.

1.1.5. «Сайт Сайтогон» — это совокупность связанных между собой веб-страниц, размещенных в сети Интернет по уникальному адресу (URL): sitogon.ru, а также его субдоменах.

1.1.6. «Субдомены» — это страницы или совокупность страниц, расположенные на доменах третьего уровня, принадлежащие сайту Сайтогон, а также другие временные страницы, внизу который указана контактная информация Администрации

1.1.5. «Пользователь сайта Сайтогон » (далее Пользователь) – лицо, имеющее доступ к сайту Сайтогон, посредством сети Интернет и использующее информацию, материалы и продукты сайта Сайтогон.

1.1.7. «Cookies» — небольшой фрагмент данных, отправленный веб-сервером и хранимый на компьютере пользователя, который веб-клиент или веб-браузер каждый раз пересылает веб-серверу в HTTP-запросе при попытке открыть страницу соответствующего сайта.

1.1.8. «IP-адрес» — уникальный сетевой адрес узла в компьютерной сети, через который Пользователь получает доступ на Сайт.

1.1.9. «Товар » — продукт, который Пользователь заказывает на сайте и оплачивает через платёжные системы.
 

2. Общие положения

2.1. Использование сайта Сайтогон Пользователем означает согласие с настоящей Политикой конфиденциальности и условиями обработки персональных данных Пользователя.

2.2. В случае несогласия с условиями Политики конфиденциальности Пользователь должен прекратить использование сайта Сайтогон .

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

2.4. Администрация не проверяет достоверность персональных данных, предоставляемых Пользователем.
 

3. Предмет политики конфиденциальности

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

3.2. Персональные данные, разрешённые к обработке в рамках настоящей Политики конфиденциальности, предоставляются Пользователем путём заполнения форм на сайте Сайтогон и включают в себя следующую информацию:
3.2.1. фамилию, имя, отчество Пользователя;
3.2.2. контактный телефон Пользователя;
3.2.3. адрес электронной почты (e-mail)
3.2.4. место жительство Пользователя (при необходимости)
3.2.5. адрес доставки Товара (при необходимости) 3.2.6. фотографию (при необходимости).

3.3. Сайт защищает Данные, которые автоматически передаются при посещении страниц:
— IP адрес;
— информация из cookies;
— информация о браузере 
— время доступа;
— реферер (адрес предыдущей страницы).

3.3.1. Отключение cookies может повлечь невозможность доступа к частям сайта , требующим авторизации.

3.3.2. Сайт осуществляет сбор статистики об IP-адресах своих посетителей. Данная информация используется с целью предотвращения, выявления и решения технических проблем.

3.4. Любая иная персональная информация неоговоренная выше (история посещения, используемые браузеры, операционные системы и т.д.) подлежит надежному хранению и нераспространению, за исключением случаев, предусмотренных в п.п. 5.2. и 5.3. настоящей Политики конфиденциальности.
 

4. Цели сбора персональной информации пользователя

4.1. Персональные данные Пользователя Администрация может использовать в целях:
4.1.1. Идентификации Пользователя, зарегистрированного на сайте Сайтогон для его дальнейшей авторизации, оформления заказа и других действий.
4.1.2. Предоставления Пользователю доступа к персонализированным данным сайта Сайтогон.
4.1.3. Установления с Пользователем обратной связи, включая направление уведомлений, запросов, касающихся использования сайта Сайтогон, оказания услуг и обработки запросов и заявок от Пользователя.

4.1.4. Определения места нахождения Пользователя для обеспечения безопасности, предотвращения мошенничества.
4.1.5. Подтверждения достоверности и полноты персональных данных, предоставленных Пользователем.
4.1.6. Создания учетной записи для использования частей сайта Сайтогон, если Пользователь дал согласие на создание учетной записи.
4.1.7. Уведомления Пользователя по электронной почте.
4.1.8. Предоставления Пользователю эффективной технической поддержки при возникновении проблем, связанных с использованием сайта Сайтогон.
4.1.9. Предоставления Пользователю с его согласия специальных предложений, информации о ценах, новостной рассылки и иных сведений от имени сайта Сайтогон.
4.1.10. Осуществления рекламной деятельности с согласия Пользователя.
 

5. Способы и сроки обработки персональной информации

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

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

5.3. Персональные данные Пользователя могут быть переданы уполномоченным органам государственной власти Российской Федерации только по основаниям и в порядке, установленным законодательством Российской Федерации.

5.4. При утрате или разглашении персональных данных Администрация вправе не информировать Пользователя об утрате или разглашении персональных данных.

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

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

6. Права и обязанности сторон

6.1. Пользователь вправе:

6.1.1. Принимать свободное решение о предоставлении своих персональных данных, необходимых для использования сайта Сайтогон, и давать согласие на их обработку.

6.1.2. Обновить, дополнить предоставленную информацию о персональных данных в случае изменения данной информации.

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

6.2. Администрация обязана:

6.2.1. Использовать полученную информацию исключительно для целей, указанных в п. 4 настоящей Политики конфиденциальности.

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

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

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

7. Ответственность сторон

7.1. Администрация, не исполнившая свои обязательства, несёт ответственность за убытки, понесённые Пользователем в связи с неправомерным использованием персональных данных, в соответствии с законодательством Российской Федерации, за исключением случаев, предусмотренных п.п. 5.2., 5.3. и 7.2. настоящей Политики Конфиденциальности.

7.2. В случае утраты или разглашения Конфиденциальной информации Администрация не несёт ответственность, если данная конфиденциальная информация:
7.2.1. Стала публичным достоянием до её утраты или разглашения.
7.2.2. Была получена от третьей стороны до момента её получения Администрацией Ресурса.
7.2.3. Была разглашена с согласия Пользователя.

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

7.4. Пользователь признает, что ответственность за любую информацию (в том числе, но не ограничиваясь: файлы с данными, тексты и т. д.), к которой он может иметь доступ как к части сайта Сайтогон, несет лицо, предоставившее такую информацию.

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

7.6. В отношение текстовых материалов (статей, публикаций, находящихся в свободном публичном доступе на сайте Сайтогон) допускается их распространение при условии, что будет дана ссылка на Сайт.

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

7.8. Администрация не несет ответственности за любые прямые или косвенные убытки, произошедшие из-за: использования либо невозможности использования сайта, либо отдельных сервисов; несанкционированного доступа к коммуникациям Пользователя; заявления или поведение любого третьего лица на сайте.

7.9. Администрация не несет ответственность за какую-либо информацию, размещенную пользователем на сайте Сайтогон, включая, но не ограничиваясь: информацию, защищенную авторским правом, без прямого согласия владельца авторского права.
 

8. Разрешение споров

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

8.2. Получатель претензии в течение 30 календарных дней со дня получения претензии, письменно или в электронном виде уведомляет заявителя претензии о результатах рассмотрения претензии.

8.3. При не достижении соглашения спор будет передан на рассмотрение Арбитражного суда г. Окуловка.

8.4. К настоящей Политике конфиденциальности и отношениям между Пользователем и Администрацией применяется действующее законодательство Российской Федерации.
 

9. Дополнительные условия

9.1. Администрация вправе вносить изменения в настоящую Политику конфиденциальности без согласия Пользователя.

9.2. Новая Политика конфиденциальности вступает в силу с момента ее размещения на сайте Сайтогон, если иное не предусмотрено новой редакцией Политики конфиденциальности.

9.3. Все предложения или вопросы касательно настоящей Политики конфиденциальности следует сообщать по адресу: [email protected]

9.4. Действующая Политика конфиденциальности размещена на странице по адресу https://sitogon.ru/politika

Обновлено: 20 Июля 2017 года

г. Окуловка, Индивидуальный предприниматель Егоров Владимир Кирович, ОГРНИП 312530228500047, ИНН 532106023766

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

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

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

Для настройки модальной формы не требуются знания программирования. Все делается онлайн с помощью конструкторов сайтов. Улучшенный поиск всплывающих модальных тем WordPress поможет посетителям найти для себя наиболее актуальную информацию. Лучший дизайн веб-сайта с бесплатной загрузкой имеет максимальную настройку в сочетании с полностью интуитивно понятным веб-дизайном. Так много шаблонов bootstrap и bootstrap 4 позволяют создавать современные элегантные целевые страницы, легко расширяемые на более важные сайты.

Модальные бесплатные темы. UX-дизайн подходит не только для одностраничного веб-сайта-портфолио или целевой страницы для небольшой компании, но и для крупных коммерческих проектов. В модальных шаблонах всплывающих окон есть модальная контактная форма, знак регистрации и т. Д. Некоторые плагины WordPress позволяют максимально быструю загрузку вашего шаблона. Модальные шаблоны писем, которые вы можете использовать для создания своих рассылок. Бесплатные HTML шаблоны для модальных всплывающих окон. Они изготавливаются профессиональными дизайнерами и регулярно обновляются. Идеи о том, как создать основной контент вашего шаблона, вы можете взять с нуля. Таблица цен, текст кнопок и другие элементы материального дизайна сделаны уникальными для модальных шаблонов веб-сайтов.

Всплывающее модальное окно на чистом CSS

Модальные окна очень часто используются вебмастерами на сайтах, потому что очень удобны, и помогают пользователю сконцентрировать все внимание на нужном контенте. Обычно для использования модального окна на WordPress сайте устанавливаются такие плагины как Fancybox, Lightbox и другие подобные. Но бывают случаи, когда необходимо отказаться от jQuery и добавить модальное окно на сайт с помощью CSS.

Модальное окно на CSS

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

1. Скачайте CSS файл стилей

Для начала вам необходимо скачать CSS файл с необходимыми стилями по ссылке ниже.

Скачать файл стилей

2. Подключите файл стилей в header.php

Загрузите скачанную папку в корневой каталог вашего сайта. Затем подключите этот файл, добавив следующую строку в файле header.php:

<link rel="stylesheet" type="text/css" href="/modal/style.css" />

3.  Добавьте кнопку для вызова модального окна

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

<a href="#modal">Открыть модальное окно</a>

4. Добавьте содержимое модального окна

После этого добавьте  блок с содержимым модального окна. Содержимое может быть абсолютно любым:

<div>
    <div>
       <div>Любое содержимое модального окна</div>
        <a href="#close" title="Закрыть">Закрыть</a>
    </div>        
</div>

DIV блок с содержимым модального окна можно разместить в файле single.php или в footer.php.

Остались вопросы?

Если у вас остались вопросы или есть чем дополнить — выражайтесь в комментариях.

Как сделать popup в WordPress?

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

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

Если вы решили идти в ногу со временем и намерены сделать свой ресурс посещаемым большим количеством пользователей, то на сайте wordpress.org вы найдете обширный список всевозможных платных и бесплатных плагинов popup для WordPress.

Предлагаем вашему вниманию  ТОР 10 бесплатных popup WordPress с современными дизайнами для  всплывающих окон. Также вы можете просмотреть современные шаблоны WordPress, которые уже упакованные WordPress popup.

Cherry PopUps

Cherry является одним из лучших WordPress popup, когда дело доходит до настройки. Он позволяет экспериментировать с различными типами макетов, стилями цвета, типами фона и анимацией.

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

Загрузить бесплатно | Узнать больше

Плагин имеет уникальную функцию, которая поможет вам удвоить эффективность всплывающих окон. Он позволяет отображать два всплывающих окна на одной странице, один сверху, а другой внизу. Кроме этого, Cherry интегрирован с MailChimp и с WordPress Social Login.

OptinMonster WordPress Popup Plugin

OptinMonster в настоящее время — лучший плагин popup для WordPress на wordpress.org. Он поставляется с мощным конструктором drag-and-drop для создания всплывающих окон и 26 CSS3 эффектами для их анимации. Если у вас нет времени разрабатывать всплывающее окно, то можете выбрать подходящее из 22 уже предварительно разработанных тем.

Загрузить бесплатно | Узнать больше

Этот плагин позволяет настроить таргетинг посетителей на основе их местоположения, времени, которое они проводят на сайте и источника реферера (поисковая система, социальная сеть и т.д.). Благодаря сегментации, новые и постоянные посетители смогут увидеть разные всплывающие окна, а интеграция с Google Analytics даст вам четкое представление о том, насколько хорошо ваши всплывающие окна конвертируются.

Popup Maker WordPress Plugin

Этот WordPress popup идеально вам подходит, если вы хотите бесплатно создать адаптивные всплывающие окна. Встроенный WYSIWYG редактор позволит настроить размер всплывающего окна, позицию, скорость анимации и другие параметры.

Плагин поставляется с конструктором. С его помощью можно настраивать цвета, тени, шрифты, отступы и не только.

Загрузить бесплатно | Узнать больше

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

Hustle WordPress Popup Plugin

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

Блокировщики рекламы не являются проблемой, если вы используете Hustle. Этот плагин popup для WordPress сможет обойти любой рекламный блок и отображать всплывающие окна.

Загрузить бесплатно | Узнать больше

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

Popup Builder WordPress Plugin

Этот плагин popup для WordPress имеет четыре настраиваемые темы, включая Simple, Postal, Coupon и CTA. Всплывающие окна смогут отображаться в верхней или нижней части вашего сайта.

Загрузить бесплатно | Узнать больше

Icegram WordPress Popup Plugin

Icegram — это плагин WordPress с 20 + адаптивными темами. Вы сможете настроить всплывающие окна, учитывая основные цвета своего бренда и, при желании, добавить анимацию входа и выхода. Если вы технически подкованы, то возможно расширить стандартные параметры настройки с помощью пользовательских HTML, CSS и JS.

Загрузить бесплатно | Узнать больше

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

MailMunch WordPress Popup Plugin

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

Загрузить бесплатно | Узнать больше

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

ITRO WordPress Popup Plugin

ITRO — плагин popup для WordPress с широким набором функций и возможностей. Вы можете редактировать свои всплывающие окна изменяя цвет, фон, отступы, границы и т.д., а также используя Fade-in или Fade-Out эффекты.

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

Загрузить бесплатно | Узнать больше

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

WordPress Popup Plugin by Supsystic

Supsystic — функциональный плагин WordPress с 30 + удобными для мобильных устройств шаблонами, более 20 плавными анимациями и несколькими настройками таргетинга для привлечения нужной аудитории. Вы можете показывать всплывающие окна новым посетителям, жителям определенной страны, носителям определенного языка, пользователям мобильных устройств и т.д. Если вы не хотите делать свой контент доступным для незарегистрированных пользователей, у плагина есть возможность заблокировать его.

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

Загрузить бесплатно | Узнать больше

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

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

Modal Window WordPress Plugin

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

Загрузить бесплатно | Узнать больше

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

***

Рассмотрев 10 плагинов popup для WordPress, предлагаю вам выбрать наиболее подходящий для вашего сайта и установить его как можно быстрее. В этом обзоре представлены только надежные плагины, одобренные официальным сообществом WordPress. Кроме этого, большинство из них поставляются с дополнительными удобными функциями: расширенными настройками, возможностями таргетинга, аналитикой и A/B тестированием.

 

P.S. Уверены, что не все ваши друзья знают об этих WordPress popup! Расскажите им про современные и эффективные средства email-маркетинга, разместив данный пост в социальных сетях.

 

Как создается контактная форма для WordPress?

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

Для создания формы потребуется:

1. Плагин для создания всплывающих окон;
2. Плагин для создания форм.

Для создания контактной формы мы рекомендуем использовать WPForms. Он позволяет создавать практически любые формы менее чем за 5 минут.

Для создания всплывающих окон мы используем плагин OptinMonster.

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

Чтобы создать форму обратной связи, в панели администрирования WordPress перейдите в раздел WPForms > Add New.

На следующей странице выберите шаблон Simple contact form и задайте ей имя.

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

Сохраните внесенные изменения. После этого созданная форма будет готова к работе. Затем перейдите на вкладку Embed и скопируйте код формы.

Чтобы создать модальное всплывающее окно, в административной панели WordPress перейдите в раздел OptinMonster > Create New Campaign.

На следующей странице выберите тип кампании Simple contact form.

В качестве шаблона установите Canvas. Это пустой холст, куда можно вставить любой код HTML, CSS, JavaScript.

На следующей странице введите название кампании.

Затем перейдите на вкладку Start building. После этого вы будете перенаправлены в конструктор. Чтобы создать всплывающее окно, используйте параметры, расположенные на вкладке Design.

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

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

<h4>Do you have any questions?</h4>
<p class=»tagline»>Want to ask more about our service? Simply fill out the form and we’ll get back to you as soon as possible.
<!— код вашей формы WPForms —>

Сохраните внесенные изменения. После этого перейдите на вкладку Display rules и установите время на ноль.

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

Нажмите на кнопку Yes/No, расположенную в верхней части экрана и перейдите на вкладку Activate.

На вкладке Publish переключите статус в режим live.

После этого перейдите в раздел OptinMonster > Campaigns. Здесь вы увидите свою кампанию. Нажмите на кнопку Edit output settings и становите флажок Enable the campaign on site.

Нажмите кнопку Save settings, расположенную в конце страницы.

Сначала скопируйте ключ вашей кампании OptinMonster, который указан рядом с ее названием.

Создайте новую страницу в WordPress. Затем перейдите в текстовый редактор WordPress и добавьте приведенный ниже код. Не забудьте вставить ваш ключ.

<a href=»#» class=»manual-optin-trigger» data-optin-slug=»ваш ключ здесь»>Contact us</a>

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

Данная публикация является переводом статьи «How to Create a Contact Form Popup in WordPress – Step by Step» , подготовленная редакцией проекта.

Коллекция модальных окон и форм – Dobrovoimaster

Здравствуйте всем. Посмотрел тут на днях внимательно статистику блога и обнаружил, что больший интерес у наших интернет-трудящихся вызывают уроки и примеры по созданию модальных окон. Самыми популярными оказались решения реализации всплывающих окон без использования javascript, исключительно на чистом CSS3.
За время работы у меня накопилось немало интересных решений, которые в разное время я детально расписал в развернутых статьях на страницах своего блога, но многие из этих уроков со временем ушли на задний план. Читателям блога иной раз сложно сориентироваться и большая часть работоспособных методов создания эффектных модальных окон и всплывающих форм просто остаются незамеченными.
Поэтому, учитывая интерес пользователей к данному вопросу, решил объединить все уроки и примеры по данной теме и вывести в отдельной статье коллекцию модальных окон и форм. Получился небольшой обзор с кратким описанием, ссылками на примеры и статьи. Так что смотрите, изучайте и если кому-то, какое-либо из решений придётся по душе, смело забирайте исходники, и творите, творите, творите…

1. Модальные окна с помощью CSS3 без Javascript

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

---

 

2. Модальное окно с помощью CSS и jQuery

Очень простой, лёгкий плагин jQuery, с помощью которого вы сможете быстро и без проблем реализовать у себя на сайте вывод модальных модальных окон с любой информацией, будь то простой текст, картинки, различный формы или встроенное видео.
Внешний вид формируется с помощью CSS, размер окна задается непосредственно в ссылке, в атрибуте href="#?w=500", где #?w=500 указывает необходимую ширину окна. Впрочем, изучив детали урока, всё станет предельно ясно. Для работы данного решения необходима подключённая к сайту библиотека jQuery.
 

---

 

3. Адаптивное модальное окно строго по центру

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

---

 

4. Модальное окно на HTML5, CSS3 и скрытых чекбоксах

Довольно свежая метода для реализации всплывающих(модальных) окошек. Скрытые чекбоксы я чаще использовал для создания раскрывающихся информационных блоков или «аккордеонов». В результате оказалось всё очень даже просто, с помощью CSS3 и синтаксических особенностей HTML5 можно легко организовать работу модальных окон. На оформлении особо не зацикливался(вся суть не в этом), за исходную взял пример инфо-блоков Bootstrap. Способ отлично срабатывает во всех современных браузерах, пользователи застрявшие на замшелых версиях IE-шки, к сожалению пролетают мимо.
 

---

 

5. Модальный блок видео на CSS3

Не даёт мне покоя тема организации просмотра видео в модальном блоке, исключительно средствами CSS3, без javascrip. Нет с выводом видео в модальном окне всё в порядке, не могу найти адекватного и всех устраивающего решения остановки видео при закрытии окна. Тупо использовал ссылку с пустым атрибутом href=”/”, многих распальцованных мастеровых от этого не совсем кошерного способа переворачивает во сне, но другого более действенного и валидного решения, на данный момент пока не нашёл.
 

---

 

6. Ротатор контента в модальном окне

Меня часто спрашивали, можно ли встроить внутрь модального окна, какой-нибудь слайдер, не только для картинок, но и для текста. Почему бы и нет. У буржуинов нашелся простенький, подходящий по всем параметрам ротатор контента, оставалось объединить его с уже готовым модальным окном. И в итоге получилось то, что получилось:)). Посмотрите, всё довольно просто в исполнении.
 

---

 

7. Интеграция контактной формы в модальное окно

На многих сайтах используются всплывающие формы обратной связи, формы регистрации и входа. Проще всего встроить рабочую форму в готовое модальное окно. Берётся вполне себе приличная форма, свёрстанная на CSS3, любой вариант модального окна представленный выше, остаётся лишь оба эти элемента объединить в единый механизм. Как это сделать? Именно об этом, подробно расписано в представленном уроке.
 

---

 

8. Модальная форма контактов на CSS3

Отличная возможность для ваших пользователей отправлять сообщения с любой страницы, или отдельной записи сайта (блога) — это отдельная, модальная форма контактов. Правильно прикручиваете к форме php-обработчик, размещаете в тело нужной вам страницы и всё, остаётся только периодически проверять свой почтовый ящик. Данный метод корректно работает во всех современных браузерах: Chrome, Firefox, Opera, Safari, так же в Internet Explorer, начиная с 9-й версии. Сама форма наделена функциями модального окна с помощью магии CSS3.
 

---

 

9. Lightbox Эффект на CSS3

Лайтбокс своего рода то же модальное окно, вернее принцип работы практически тот же, правда используется по большей части для просмотра увеличенных или полно-размерных изображений. В своё время решил заделать более-менее адаптивную версию Lightbox, исключительно средствами CSS3. Что из этого получилось сможете узнать посмотрев пример и если тема вставит, изучите и урок. Пользователи плотно подсевшие на IE 8 и ниже, к сожалению ничего не увидят, метод основан на использовании псевдокласса :target.
 

---

 

10. Всплывающая контактная форма для сайта

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

---

 

11. Всплывающее окно при загрузке сайта с помощью CSS3 и немного javascript

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

---

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

С Уважением, Андрей .

Буду всем признателен, если поддержите проект — добавив блог в исключения AdBlock и поделитесь ссылкой на запись в своих соц-сетях:

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

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

В этом посте я поделюсь и сравню 10 отличных плагинов для всплывающих окон, которые вы можете использовать на своем сайте. Некоторые из них представляют собой простые всплывающие инструменты с базовым редактором, в то время как другие предлагают подробные конструкторы перетаскивания, A / B-тестирование и более продвинутые функции (за цену, конечно!).

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

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

ConvertPlus — это всплывающий плагин от Brainstorm Force, той же команды, что и другие популярные инструменты, такие как тема Astra и расширение Ultimate Addons for Beaver Builder для Beaver Builder.

Возможности

ConvertPlus

ConvertPlus помогает создавать всплывающие окна для различных целей, например:

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

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

Наконец, ConvertPlus включает подробные параметры таргетинга / триггера, а также встроенное A / B-тестирование и аналитику, которые помогут вам оптимизировать всплывающие окна.

Параметры таргетинга / запуска ConvertPlus

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

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

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

• Таргетинг на уровне страницы
• Обнаружение реферера (e.грамм. создать специальное всплывающее окно для посетителей с партнерского сайта)
• Новые и постоянные посетители
• Устройство
• Печенье
• Зарегистрированных пользователей

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

Чтобы создать всплывающее окно, сначала нужно выбрать один из более чем 100 включенных шаблонов. Затем вы воспользуетесь интерфейсом настройщика WordPress в реальном времени, чтобы настроить элементы этого шаблона, например:

• Поля / метки формы
• Другой текст
• Цвета
• Анимации

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

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

Стоимость ConvertPlus

ConvertPlus стоит 24 доллара на CodeCanyon.

Подробнее / Скачать демо

Имея более 36 000 продаж, Ninja Popups определенно является одним из самых популярных плагинов для всплывающих окон на CodeCanyon.Он существует уже почти 8 лет, и за это время разработчик постоянно предлагал новые функции и улучшения.

Мораль рассказа — в нем много функциональности!

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

Во-первых, Ninja Popups предоставляет вам визуальный конструктор перетаскивания, который вы можете использовать для создания своих всплывающих окон. Вы можете создать его с нуля или выбрать одну из 76+ готовых всплывающих тем.

Одна из его отличительных черт — это возможности анимации.Вы можете применить к своим всплывающим окнам более 74 различных анимационных эффектов.

И если вы хотите оптимизировать свои всплывающие окна, он поставляется со встроенной аналитикой и A / B-тестированием, а также с интеграцией отслеживания событий Google Analytics, чтобы вы могли отслеживать данные в Google Analytics.

Параметры таргетинга / запуска всплывающих окон ниндзя

Как и ConvertPlus, Ninja Popups предлагает множество вариантов запуска, включая:

• Глубина прокрутки
• Время
• Намерение выхода
• Бездействие пользователя
• Нажмите (для двухэтапной подписки)

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

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

Для создания или редактирования всплывающих окон Ninja Popups предоставляет визуальный конструктор перетаскивания, который очень похож на легкий конструктор страниц:

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

Всплывающие окна ниндзя Цена

Ninja Popups стоит 27 долларов на CodeCanyon.

Подробнее / Скачать демо

Bloom — это всплывающий плагин от Elegant Themes, создателей популярной темы Divi.В результате он доступен только как часть полного членства в Elegant Themes. Это делает его дорогим, если все, что вам нужно, это Блум. Но если вам нравятся другие предложения Elegant Themes, общее членство предлагает большую ценность.

Прочтите наш полный обзор Bloom, чтобы узнать больше.

Характеристики Блума

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

В нем нет конструктора перетаскивания, но он поставляется с более чем 100 шаблонами, которые вы можете настроить в соответствии с вашими потребностями, а также с некоторыми уникальными параметрами триггера / таргетинга (подробнее о них через секунду).

И на этой великолепной панели инструментов Bloom вы также можете настроить A / B-тесты и просматривать аналитику, чтобы увидеть, как работают все ваши всплывающие окна.

Параметры нацеливания / запуска Bloom

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

Во-первых, он дает вам стандартные триггеры, например:

• Время
• Глубина прокрутки
• Бездействие

Затем он выполняет привязку к этим двум уникальным триггерам:

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

Однако отсутствует один триггер — вы не получаете никакого намерения выхода.

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

• Посты
• Типы сообщений
• Категории постов

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

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

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

• Текст
• Цвета
• Изображения
• Анимации
• Детали формы
• и т. Д.

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

Bloom Стоимость

Bloom доступен в рамках членства в Elegant Themes, которое стоит 89 долларов за один год поддержки и обновлений или 249 долларов за пожизненную поддержку и обновления.

Подробнее / Скачать демо

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

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

OptinMonster Характеристики

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

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

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

А если вы хотите оптимизировать всплывающие окна, OptinMonster включает встроенное A / B-тестирование и многовариантное тестирование.

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

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

Опции прицеливания / срабатывания OptinMonster

OptinMonster имеет торговую марку «Exit-Intent», так что вы можете поспорить, что они предлагают триггеры для выхода!

Кроме того, вы также получаете:

• Свиток
• Время
• Бездействие пользователя
• Нажмите (для двухэтапной подписки)

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

Что касается таргетинга, у OptinMonster, вероятно, самые глубокие варианты таргетинга из всех инструментов в этом списке.Вы можете настроить таргетинг на свои всплывающие окна:

• Страница
• Реферер
• Новые и постоянные посетители
• Печенье
• Геолокация (это уникально)
• Устройство
• Использование Adblock

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

Благодаря недавним улучшениям, OptinMonster теперь предлагает полноценный визуальный редактор с перетаскиванием. Вы можете создавать свои всплывающие окна с помощью виджетов, так же как функции конструктора страниц WordPress:

OptinMonster Цена

Тарифные планы

OptinMonster начинаются с 9 долларов в месяц (оплата ежегодно).Тем не менее, если вы хотите получить доступ к A / B-тестированию, Exit-Intent и другим расширенным функциям, вам потребуются планы более высокого уровня.

Подробнее / Скачать

Elementor — популярный плагин для создания страниц WordPress, который используется более чем на миллионе сайтов WordPress (также ознакомьтесь с нашим обзором Elementor Pro).

Однако с надстройкой Elementor Pro вы получаете доступ к функции под названием Popup Builder.

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

Если вы хотите, чтобы у вас был 100% контроль над всплывающими окнами, это отличный вариант.

Elementor Pro Особенности

Elementor Pro позволяет создавать различные типы всплывающих окон, в том числе:

• Модальные всплывающие окна
• Верхняя или нижняя панели уведомлений
• Облет
• Вставки
• Полноэкранные оверлеи

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

• Формы подписки по электронной почте
• Пуговицы
• Таймеры обратного отсчета
• Формы входа
• Контактные формы
• Регистрационные формы
• и т. Д.

И у вас также есть полный контроль над тем, как выглядит это содержимое.

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

Единственная область, в которой Elementor Pro отстает от других инструментов, — это аналитика.В настоящее время нет встроенной аналитики или A / B-тестирования.

Elementor Pro Параметры таргетинга / триггера

Elementor Pro поставляется с подробным набором параметров таргетинга и триггера.

Во-первых, вы можете сопоставить свои всплывающие окна с определенным контентом WordPress с помощью правил таргетинга для:

• Конкретные сообщения или страницы
• Категории или теги
• Типы сообщений
• Форматы сообщений
• Архивные страницы

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

• Устройство
• Статус входа пользователя
• просмотров страниц или сеансов
• Источник перехода / URL

А что касается триггеров, вы можете вызвать всплывающее окно по:

• Нажмите
• Время
• Свиток
• Бездействие
• Намерение выхода

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

Для создания своих всплывающих окон вы можете сначала выбрать из более чем 100 готовых шаблонов или с чистого листа.

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

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

Elementor Pro Цены

Хотя вы можете получить основную версию Elementor бесплатно на WordPress.org, вам понадобится надстройка Elementor Pro для доступа к функциям Popup Builder.

Elementor Pro стоит 49 долларов за лицензию на один сайт и составляет до 199 долларов за использование на неограниченном количестве сайтов.

Подробнее / Скачать

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

Его купили более 15 000 раз, пока у него остается звездная 4.79-звездочный рейтинг для всех этих клиентов.

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

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

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

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

Параметры прицеливания / срабатывания

Вы уже слышали о триггерах кликов выше, но многоуровневые всплывающие окна также имеют триггеры для:

• Время
• Свиток
• Бездействие пользователя
• пользователей Adblock

Если вы разработчик, вам также понравятся специальные обработчики JavaScript, которые дадут вам еще больше контроля.И вы также получаете возможность запускать свои всплывающие окна только в определенные даты / время, как и OptinMonster.

Затем вы можете выбрать цель:

• Индивидуальное содержание
• Типы сообщений
• Категории или другие таксономии
• Устройства

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

Визуальный конструктор

Layered Popups немного уникален тем, что он состоит из разных «слоев», вроде того, что вы использовали бы в Photoshop или многослойном слайдере (теперь вы понимаете название плагина!).Например, у вас могут быть отдельные слои для:

• Фон
• Поле формы электронной почты
• Кнопка отправки
• Кнопка закрытия
• и т. Д.

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

• Переключение между слоями
• Настроить слои

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

Стоимость

Layered Popups стоит 21 доллар на CodeCanyon.

Подробнее / Скачать демо

Icegram доступен как в бесплатной, так и в премиум-версии. Бесплатная версия на WordPress.org подходит для базовых всплывающих окон, в то время как версия Pro включает больше триггеров, аналитики и других расширенных функций.

Icegram Особенности

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

Если вы перейдете на Pro, вы получите новые функции, такие как A / B-тестирование, аналитику и более 100 готовых тем.

Параметры таргетинга / запуска Icegram

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

• Выход-намерение
• Свиток
• По клику (двухэтапная подписка)
• JavaScript

Для таргетинга бесплатная версия немного шире.Это позволяет вам нацеливаться на:

А если вы выберете премиум-версию, вы также получите геотаргетинг.

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

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

Icegram Стоимость

На WordPress.org есть бесплатная версия. После этого платные планы начинаются с 97 долларов в год.

Подробнее / Скачать демо

Popup Maker — самый популярный плагин для всплывающих окон на WordPress.org, где он предлагает довольно просторную бесплатную версию. Эта щедрость окупилась в виде 4,9-звездочного рейтинга более чем 3700 отзывов.

Popup Maker Особенности

Одна из областей, в которой Popup Maker выделяется, — это специфичные для WordPress правила таргетинга и запуска, особенно в платной версии. Он даже включает некоторые правила таргетинга для WooCommerce, которые отлично подходят для магазинов электронной коммерции.

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

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

• Закрыть всплывающее окно
• Открыть всплывающее окно
• Преобразовать

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

А если вы разработчик, в нем есть множество хуков и фильтров, которые помогут вам настроить работу всего.

Параметры таргетинга / запуска Popup Maker

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

Когда дело доходит до таргетинга, я думаю, что Popup Maker имеет лучшие правила таргетинга для WordPress среди всех всплывающих плагинов в этом списке.

Вы можете настроить таргетинг на свои всплывающие окна по:

• Контент (конкретные сообщения / страницы, типы сообщений, категории и т. Д.)
• Пользователь (статус входа, роль пользователя, общая активность)
• Устройство
• Реферал
• Параметр запроса

И еще у него есть специальная интеграция с WooCommerce, которая позволяет настраивать таргетинг на всплывающие окна на основе:

• Что в тележках покупателей
• Статус лицензии или подписки
• Данные покупки

Кроме того, вы можете создавать свои собственные пользовательские условия, «используя любые функции на основе PHP или JavaScript, которые возвращают логическое значение», что, как я полагаю, позволяет вам настраивать всплывающие окна на основе информации пользовательского профиля, которую вы установили (и многое другое).

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

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

• Спусковой крючок
• Кнопка закрытия
• Форма подписки

В мета-поле под текстовым редактором вы можете настроить такие вещи, как:

• Триггеры
• Правила таргетинга
• Стиль / размер / анимация
• Закрыть функциональность

Стоимость Popup Maker

На WordPress есть очень популярная бесплатная версия.org, который довольно щедр по своей функциональности. А затем, если вы хотите большего, вы можете либо приобрести отдельные расширения по цене от 15 долларов каждое, либо вы можете подписаться на один из их премиальных планов по цене от 87 долларов, чтобы получить необходимый вам пакет.

Подробнее / Скачать демо

WP Subscribe Pro — это премиальный плагин MyThemeShop для всплывающих окон. Несмотря на то, что на WordPress.org есть ограниченная бесплатная версия, большинство людей будут довольны расширенной функциональностью в версии Pro, поэтому я сосредоточусь на этом ниже.

WP Подписаться Pro Возможности

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

Вы сможете отобразить:

• A подписка на
• Похожие сообщения
• Ваш собственный HTML или шорткод

И вы также получаете большинство важных опций триггера и таргетинга.

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

WP Subscribe Pro Параметры таргетинга / запуска

WP Subscribe Pro включает большинство важных триггеров. Вы можете запускать всплывающие окна:

• Сразу
• После задержки
• Когда пользователь прокручивает контент до конца
• По намерению выхода

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

Правила таргетинга в значительной степени ограничены конкретным контентом WordPress. Вы можете выбрать, отображать ли это на вашем:

• Титульная страница
• Одиночные стойки
• Архивные страницы
• Результаты поиска
• 404 стр.

И вы также можете исключить отдельные части контента в редакторе WordPress.

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

На самом деле «строителя» нет. Вместо этого вы в основном заполняете форму, которая соответствует областям на готовом макете:

WP Подписаться Pro Цена

На WordPress есть ограниченная бесплатная версия.орг. Но если вам нужна WP Subscribe Pro, на которой мы сосредоточились, вы заплатите 29 долларов.

Подробнее / Скачать демо

Как и OptinMonster, PopUp Domination на самом деле является инструментом SaaS, а не плагином WordPress для самостоятельного размещения. Тем не менее, его очень легко использовать с вашим сайтом WordPress. Все это означает, что вы фактически будете управлять своими всплывающими окнами из интерфейса PopUp Domination, а не из панели управления WordPress.

С учетом сказанного, он имеет совершенно другую структуру ценообразования, чем OptinMonster, что может сделать его дешевле или дороже в зависимости от вашей ситуации (подробнее об этом позже!).

Особенности PopUp Domination

PopUp Domination предлагает довольно обширный список функций. Вы получаете:

• Подробные параметры прицеливания / триггера
• Готовые шаблоны
• A / B тестирование и аналитика
• Тонны гибкости для того, какие типы всплывающих окон вы создаете (например, подписка на электронную почту, продвижение, таймеры обратного отсчета и т. Д.)
• Отслеживание событий Google Analytics

Параметры таргетинга / запуска PopUp Domination

PopUp Domination имеет подробный набор опций запуска, которые помещают его прямо в OptinMonster.Вы можете запускать по:

• Глубина прокрутки
• Время на странице
• Бездействие пользователя
• Намерение выхода
• По клику (для двухэтапной подписки)
• Общее время на сайте
• Наведите указатель мыши на

И вы также получаете солидный набор опций таргетинга, включая:

• Правила таргетинга на уровне страницы
• Географический таргетинг — например, показывать всплывающие окна только для определенных стран.
• Реферал
• Устройство

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

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

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

PopUp Domination Цена

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

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

Тарифные планы

PopUp Domination начинаются с 9 долларов в месяц (оплата ежегодно) и варьируется до 29 долларов в месяц. Все планы имеют одинаковые функции — единственная разница — количество всплывающих окон.

Подробнее / Скачать

Какой плагин для всплывающих окон WordPress вам подходит?

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

Что ж, давайте рассмотрим несколько сценариев.

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

ConvertPlus также является хорошим вариантом, который по-прежнему имеет довольно гибкий конструктор всплывающих окон, а Popup Maker — еще один надежный вариант из-за правил, специфичных для WordPress, хотя я не думаю, что конструктор всплывающих окон настолько удобен для начинающих.Наконец, у Блума есть несколько уникальных триггеров после комментирования / покупки.

И если вам нужен самый гибкий и простой в использовании конструктор всплывающих окон, я бы сказал OptinMonster, если вы хотите создавать что-то с нуля из-за его нового конструктора перетаскивания. Ninja Popups также отличается своим визуальным конструктором, а Layered Popups имеет уникальный многослойный подход к созданию всплывающих окон.

Elementor Pro — также отличный вариант, особенно если вы хотите создать нечто большее, чем просто подписку по электронной почте.

Или, если вам удобно настраивать шаблоны, мне нравится ConvertPlus, потому что он основан на настройщике в реальном времени, а у Bloom также отличный интерфейс.

Наконец, если вам нужен самый простой вариант, я думаю, что WP Subscribe Pro имеет наиболее удобный интерфейс, хотя и не очень гибкий.

Есть еще вопросы? Оставьте комментарий, и мы постараемся помочь!

БЕСПЛАТНЫЙ КУРС

Пристегнись!

5 шагов по ускорению
Ваш сайт на WordPress

Сделайте ваш сайт работающим на 30-40% быстрее
с помощью нескольких простых приемов

Присоединяйтесь к бесплатному курсу Плагины WordPress

— Плагины WP

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

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

CodeCanyon предлагает тысяч плагинов, которые можно предложить , все они созданы сообществом талантливых разработчиков и проверены вручную командой Envato. Давайте рассмотрим несколько примеров того, как вы можете улучшить свой веб-сайт — есть много вещей, которые вы можете сделать с плагинами WordPress, о которых, мы уверены, вы никогда не задумывались.

Сойди с ума с социальными сетями . Вы думали, что «наличие кнопок и ссылок для публикации в социальных сетях» на вашем веб-сайте — это все, что нужно для этого? Неправильный! Плагин « share-to-unlock » помещает ваш контент за сообщением, которое просит пользователей поделиться страницей в социальных сетях перед тем, как получить к ней доступ.Плагины « Tweet this » позволяют сделать любое предложение твиттером. Вы даже можете интегрировать возможность добавления реакций Facebook на свой сайт. И, конечно же, есть боковые панели и всевозможные кнопки социальных сетей. Ознакомьтесь с коллекцией плагинов для социальных сетей и получайте удовольствие.

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

Делайте что хотите с изображениями и мультимедиа . Хотите добавить красивый видео фон на свою домашнюю страницу? Или, может быть, вам нужен видеоплеер с возможностью добавления плейлистов и даже выбора разных скинов.И вы также хотите добавить немного магии SEO. Для этого есть плагин — на самом деле, более одного! То же самое и с изображениями. Есть множество вариантов для мультимедийных и графических галерей всех видов. Mobile дружественный, построенный с использованием jQuery или JavaScript — вы обязательно найдете то, что соответствует вашим потребностям.

С плагинами WordPress вы можете сделать еще больше, чтобы изменить свой веб-сайт. Но с чего-то нужно начинать, не так ли? Мы рекомендуем вам сделать это с помощью нашего курса Essential WordPress Plugins: инструктор Tuts + Рэйчел МакКоллин проведет вас через основы, чтобы вы быстро начали.И как только вы начнете … нет предела!

Как легко создать всплывающую форму WordPress (шаг за шагом)

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

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

Зачем нужна всплывающая форма WordPress?

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

Кроме того, вы также можете использовать всплывающую форму WordPress для:

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

Итак, теперь, когда вы знаете, почему вы хотите использовать всплывающую форму WordPress, давайте перейдем к тому, как именно ее создать!

Как создать всплывающую форму WordPress

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

Шаг 1. Установите необходимые плагины WordPress

Для начала вам нужно установить и активировать 2 плагина.

Во-первых, вам понадобится Popup Maker.Хотите знать, бесплатен ли создатель всплывающих окон? Да, вы можете использовать бесплатную версию этого руководства и с WPForms.

Нажмите синюю кнопку загрузки и узнайте, как установить плагин в WordPress.

Далее вам также понадобится плагин WPForms. Вот простое руководство по установке плагина WPForms.

Шаг 2. Создайте простую контактную форму

Затем вам нужно создать форму, которую вы хотите поместить во всплывающую форму WordPress. Если вы уже создали контактную форму, вы можете пропустить этот шаг.

Чтобы создать форму, перейдите на страницу WPForms »Добавить новый и выберите шаблон. В этом примере мы будем использовать простую контактную форму. Рекомендуется упростить работу с всплывающими формами WordPress, чтобы вы могли максимизировать коэффициент конверсии форм.

После загрузки формы в ней будет все необходимое для начала, в том числе:

• Имя
• Фамилия
• Электронная почта
• Комментарий

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

Когда вы закончите создание формы, вам нужно нажать кнопку «Сохранить», чтобы сохранить изменения. Ваша контактная форма готова к работе!

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

Шаг 3. Создайте всплывающее окно в Popup Maker

Отлично, ваши плагины установлены и активированы.Затем мы перейдем к плагину Popup Maker, чтобы создать ваше всплывающее окно. Этот бесплатный плагин WordPress позволяет легко создавать всплывающие окна с нуля.

Перейдите в панель управления WordPress и перейдите к Popup Maker » Add Popup , и вы увидите, что появляется экран редактирования всплывающего окна.

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

А теперь пора вставить форму во всплывающее окно. Нажмите кнопку «Добавить форму», чтобы выбрать форму.

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

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

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

Отличная работа. Давайте настроим некоторые параметры всплывающих окон, прокрутив вниз и начав с триггеров.

Триггеры сообщают вашему всплывающему окну, когда открываться. Нажмите синюю кнопку Добавить новый триггер .

В появившемся окне параметров триггера откройте раскрывающийся список и выберите Time Delay / Auto Open . Это приведет к тому, что всплывающее окно откроется после того, как посетители вашего веб-сайта будут находиться на странице в течение определенного времени.

Вы можете установить время как угодно, но мы рекомендуем начинать с 5 секунд (5000 миллисекунд).Когда будете готовы, нажмите кнопку Добавить , чтобы продолжить.

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

Затем давайте улучшим внешний вид вашего всплывающего окна, нажав на Display под настройками всплывающего окна.

В раскрывающемся списке «Тема всплывающего окна» выберите тему для всплывающего окна.

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

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

Прокрутите страницу вверх и нажмите кнопку Опубликовать , чтобы активировать всплывающую форму WordPress.

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

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

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

Кроме того, если вы настроили Google Analytics на своем веб-сайте, вы можете отслеживать Popup Maker с помощью пользовательского отслеживания событий.

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

Заключение

Хорошо, все готово. Мы надеемся, что эта статья помогла вам узнать, как создать всплывающее окно контактной формы WordPress в WordPress.

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

И если вам понравилась эта статья, подпишитесь на нас в Facebook и Twitter, чтобы получить больше бесплатных руководств по WordPress.

Бесплатный плагин: Stack Modals, простое модальное расширение для Stack для WordPress

Сегодня я рад объявить о выпуске нового плагина для нашей флагманской премиальной темы WordPress, Stack for WordPress, который добавляет гибкую систему для создания модальных окон и управления ими с помощью потрясающей модальной системы Stack.

Представляем модальные окна стека

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

Плагин изначально создавался как метод, позволяющий пользователям Variant использовать гибкие модальные окна Stack, что до сих пор было невозможно, однако вскоре я расширил его, чтобы позволить пользователям также создавать постоянные модальные окна, которые можно использовать во ВСЕХ страницы для замечательных вещей, таких как контактные формы, формы входа в систему и многое другое.

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

Как использовать модальные окна стека

Процесс создания нового модального окна с помощью Stack Modals прост — после активации плагина вы увидите новую область Stack Modal в вашем WP Admin

Здесь вы добавляете модальные окна и управляете ими. Чтобы начать добавление нового модального окна, нажмите «Добавить новый модальный стек», и вы увидите экран, не слишком отличающийся от обычного экрана редактирования сообщений

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

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

Модальные настройки

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

Модальный макет — Здесь вы можете выбрать общий стиль для модального окна, например, обычный простой модальный или что-то более причудливое, например, модальное окно с красивым фоновым изображением.

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

Тип отображения кнопок — Если вы выбрали отображение кнопки для запуска модального окна, установите здесь стиль кнопки.

Button Text — Опять же, если вы выбрали отображение кнопки, вы можете установить свою собственную метку кнопки через это поле.

Изображение блока — Если вы выбрали использование одного из макетов на основе изображения в поле «Модальный макет», упомянутом выше, вы можете установить изображение для использования здесь.

Таймер автошоу — Если вы хотите, чтобы модальное окно отображалось через определенное время, вы можете установить это время здесь.Это делается в миллисекундах, поэтому, например, если вы хотите, чтобы всплывающее окно появлялось через 10 секунд, введите 10000

.

Использование модальных окон

Чтобы использовать новый шикарный модальный окошко, у вас есть 2 варианта: вы можете либо использовать предоставленный шорткод, либо создать ссылку с определенным href, это дается вам в соответствующем поле (хотя имейте в виду, что это будет пустым пока ваш модальный не будет опубликован)

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

Или, если вы хотите создать свой собственный триггер, просто создайте ссылку и используйте код ссылки, предоставленный как ваш href, и все готово! Это действительно так просто!

В качестве примера, для запуска пользовательского модального окна из пункта меню, добавьте новые пункты меню через тип пункта меню «Пользовательский URL-адрес» и используйте предоставленную ссылку, как показано ниже.

Или для другого примера с помощью обычной ссылки

Где взять?

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

Скачать модальные окна стека

Не используется стек?

Ну, боже, ты что-то упустил! Стек — наша самая популярная, самая мощная и гибкая тема на сегодняшний день. Вы можете использовать Stack не только для создания выдающихся страниц с современным дизайном с помощью Visual Composer, Stack также предоставляется с нашим эксклюзивным конструктором страниц Variant, который обеспечивает самый быстрый и простой способ создания страниц за секунды.

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

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

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

1. Подключаемый модуль модального всплывающего окна

Модальное всплывающее окно основано на привлекательных CSS и JS, так что оно очень удивительно и легко в использовании.

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

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

2. Подключаемый модуль Popup Maker

Popup Maker — один из гибких плагинов WordPress Popup, который помогает создавать модальный контент любого типа для ваших веб-сайтов WordPress. он создает любой тип всплывающего окна, модального окна или оверлея содержимого для вашего веб-сайта WordPress. Кроме того, он поддерживает популярные формы плагинов, такие как формы Gravity, формы Ninja и другие.

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

3. Плагин Popups

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

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

4. Подключаемый модуль Popup Builder

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

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

5. Подключаемый модуль Popup Maker

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

Это одна из самых замечательных функций, позволяющих отображать всплывающее окно сообщений при наведении курсора на элемент на странице.это идеальное решение для упрощения процесса рассылки новостей и создания более удобных всплывающих окон. Они также предоставляют код для вставки, который вы можете использовать на любых веб-сайтах. Функции Popup Maker сделают из ваших неизвестных посетителей основных клиентов.

Нравится:

Нравится Загрузка …

Связанные

тем WordPress — шаблоны WordPress

Вы слышали это тысячу раз: WordPress — самая популярная система управления контентом (также известная как CMS) в мире.W3Techs сообщает, что 59% сайтов, использующих CMS, построены на WordPress. Он настолько успешен, что стал почти синонимом CMS!

Так что же делает WordPress предпочтительным выбором для миллионов разработчиков, дизайнеров и всех, кому действительно нужен веб-сайт?

Прежде всего, WordPress бесплатный и с открытым исходным кодом . Это не только означает, что вы получаете его бесплатно (да), но и то, что команда разработчиков со всего мира постоянно работает над его улучшением.Кроме того, существует безумное количество плагинов, доступных, которые интегрируются с платформой. Они позволяют вам добавлять на ваш сайт всевозможные функции — от слайдеров изображений до календарей, новостных лент, спам-фильтров и так далее. Кроме того, очень прост в использовании: его интерфейс прост и интуитивно понятен, а в Интернете есть множество руководств по WP всех видов, которые помогут вам максимально использовать его.

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

Да, любые . Не заблуждайтесь, думая, что WordPress предназначен только для веб-сайтов малого бизнеса, блогов и других проектов малого и среднего размера. Это очень далеко от истины! Множество сложных сайтов электронной коммерции построены на WordPress и работают довольно хорошо;)

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

И тема WordPress — это то, о чем эта страница! Кто они такие? Рад, что ты спросил. Речь идет о предварительно разработанных и предварительно созданных макетах , которые вы можете применить на своем веб-сайте. Если панель управления WordPress позволяет вам заботиться о содержимом вашего сайта (категории, подкатегории, разделы, страницы, текст и т. Д.), Тема будет определять, как сайт выглядит. Его визуальный дизайн и его взаимодействия. Какого цвета будет фон? Как будет выделяться ссылка при наведении указателя мыши? Будет ли на главной странице большой слайдер? Вот о чем тема.

Если вам нужно создать веб-сайт, но у вас нет времени или навыков для его самостоятельного создания — вы попали в нужное место. ThemeForest — это дом огромной и разнообразной библиотеки из тем WordPress , созданных мировым сообществом творческих людей … Но это еще не все. Давайте внимательнее посмотрим, что делает эти темы отличными:

1. Высокое качество . У нас есть не только одни из лучших дизайнеров и разработчиков, продающие свои темы на ThemeForest. Наша команда по качеству проверяет каждый из них до того, как они поступят в продажу.
2. Подходит для всех устройств . Вам не нужно, чтобы мы сообщали вам, что в настоящее время люди, скорее всего, будут посещать ваш сайт с разных устройств. Шаблоны, которые вы найдете здесь, подходят для экранов всех размеров, и вы знаете, насколько это важно.
3. Готово к электронной коммерции . В наши дни сайты электронной коммерции на базе WordPress есть повсюду в сети, и не зря! Шаблоны сайтов электронной коммерции отлично интегрируются с такими платформами, как Magento, Shopify и другие, что упрощает вам открытие интернет-магазина.
4. Творческое сообщество за работой . Envato Market является домом для крупнейшего мирового сообщества креативщиков. Наши авторы — талантливые профессионалы, безмерно увлеченные своим делом.
5. Поддержка при необходимости . Все темы поставляются с подробной документацией по их использованию. А если вам понадобится помощь с ошибками или проблемами, наши авторы будут рядом, чтобы помочь. Кроме того, справочный центр Envato всегда находится на расстоянии одного клика.

Модальное окно / всплывающее окно / лайтбокс — WP Fluent Forms

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

WP Fluent Forms v3.0.7 имеет встроенные всплывающие окна. На данный момент он предлагает триггер всплывающих окон на основе кнопок.

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

Не забудьте заменить идентификатор формы своим идентификатором

Скопируйте шорткод и вставьте его на свою страницу или в сообщение, где вы хотите отображать всплывающее окно.Не забудьте изменить идентификатор формы. Чтобы найти идентификатор формы, перейдите в Fluent Forms и щелкните все формы, как показано на скриншоте выше.

Давайте настроим шорткод всплывающего окна, чтобы изменить текст кнопки триггера, дизайн кнопки, цвет фона и т. Д.

Чтобы изменить текст кнопки, просто добавьте этот фрагмент кода (btn_text = ”Click Me”) во всплывающий шорткод. Таким образом, окончательный шорткод всплывающего окна будет

.

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

.

Хотите добавить к кнопке собственный класс CSS, чтобы можно было стилизовать ее по своему усмотрению? Идите вперед и назначьте классы CSS (css_class = ”myClass myClassAgain”) внутри шорткода кнопки. Вы должны использовать «css_class» в качестве ключа для назначения классов кнопкам.