Как сделать всплывающее окно в вордпресс. Popups — бесплатный WordPress плагин для всплывающих окон. Ninja Popup – любимчик среди других плагинов для генерации попапов

Сегодня я планирую рассказать про один плагин, который является весьма полезным для работы с сайтом на wordpress. Это плагин переведен примерно, на 75%, но этого вполне достаточно для того, чтобы начать им пользоваться.

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

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

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

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

Всплывающее окно wordpress – плагин на русском языке.

После того, как вы установили и активировали плагин у себя на сайте. Перед вам появится вот такое окно:

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

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

После того, как мы посмотрели раздел “Обзор”, рекомендую перейти в пункт “Настройки”:

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

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

Следующий раздел всплывающего окна для wordpress – это “Показать все PopUP”:

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

И, наконец, самое интересное окно – “Добавить новый PopUp”:

Вам предложат выбрать тот или иной шаблон вашего будущего всплывающего окна wordress и выбрать его название – используйте английский язык, например, “primer”. Перед вам откроется специальное окно, в котором вы сможете создать ваш PopUp.

Всплывающее окно wordpress – главные настройки.

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

Следующий раздел:

Дизайн всплывающего окна wordpress.

Про этот раздел стоит поговорить отдельно, так как он содержит дополнительные очень полезные подразделы. Не забывайте и о том, что после того, как вы вносите какие-то изменения, нужно в обязательном порядке нажимать кнопку – “Сохранить” – иначе изменения не сохраняться и вам придется все настраивать заново.

Здесь находятся специальные подразделы:

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

• • Тексты – в данной надстройке вы, собственно, пишите текст, который увидит человек, когда посетит ваш сайт.

• • Анимация открытия PopUp – здесь вы можете задать анимацию того, как ваш всплывающее окно wordpress будет появляться на мониторе у пользователя.

Подписчики всплывающего окна wordpress.

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

Логин/Регистрация всплывающего окна wordpress.

Даная настройка, к сожалению, является платной функций. Если вы считаете, что вам она необходима – рекомендую приобрести плагин:

А/Б тестирования всплывающего окна wordpress.

И в этом случае данный раздел является платным:

Статистика всплывающего окна wordpress.

На момент того, как я тестировал плагин и у меня не отображались показатели статистики, но на момент того, как я пишу эту статью плагин зафиксировал 3 показа окна.

CSS/HTML-код всплывающего окна wordpress.

В большинстве своем данный пункт редко кем используется. Проводить в нем изменения вы можете, если знаете языки CSS и HTML – в противном случае, я бы не рекомендовал вносить корректировки в код:

Я не стал “выпендриваться” и сделал стандартное всплывающее окно wordpress, вот как оно выглядит:

Надеюсь статья вам понравилась и вы захотите воспользоваться данным плагином для создания PopUP.

P.S. Во все необязательно покупать платную версию плагина, функционала бесплатной версии вполне себе достаточно.

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

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

Через такие всплывающие окна, эффект отдачи очень велик. Говорят, иногда бывает такое, что число подписчиков увеличивается в 4 раза. Круто! Не правда ли? Использование всплывающих окон (попандеров) - очень эффективный способ привлечь огромное число посетителей. Обычно их используют для:

• новостной рассылки;
• пиара платных обучающих курсов;
• раскрутки групп в соц. сетях;

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

Но! Все эти проблемы, можно обойти, если всплывающее окно настроить правильно.

Итак, давайте лучше вернемся к нашему главному вопросу.

Всплывающие окна на WordPress

1. WP-MK

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

• Рекламы (например, Google Adsense);
• Пиара своих групп в соц. сетях;
• Простой формы подписки.

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

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

2. Ninja Popups.

Если вы хотите, чтобы пользователи, заходя на ваш сайт, увидев всплывающее окно, кричали «Ухты», установите себе этот мега крутой плагин. Ninja Popups - монстр всплывающих окон на . Если сравнивать с WP-MK, то он сильно обходит его по функционалу. Я заметил, что Ninja Popups пользуются мастера своего дела. Почему? Плагин платный и не все могут позволить его себе. От себя могу сказать, что цены у них приемлемы, много не просят. Подробно о стоимости, можно узнать здесь .

Ну, давайте узнаем, что именно мы получим от этого плагина:

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

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

Как настроить плагин под себя? Я предлагаю следующее… Вместо настырного текста, лучше посмотреть обучающее видео:

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

3. Popup Maker (модальное окно)

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

• ссылку;
• кнопку;
• картинку.

Итак, как его настроить?

1. Скачиваем плагин;

2. Устанавливаем и активируем;

3. Слева в меню ищем: Pupup Maker -> Добавить новое.

4. Перед нами покажется страница, такого вида:

Ничего не напоминает? Страница вплоть аналогична форме публикаций статей на WordPress. Как видите, здесь добавились некие дополнительные функции (настройки).

Давайте разберем их более подробно.

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

Укажите здесь заголовок окна - пишем название (например: подписка на новости).

Условия таргетинга - отмечаем галочкой, где будет отображаться наше окно.

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

Код - что будет отображаться в окне. В нашем случае видео с YouTube:

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

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

Но это друзья еще не все. Переходим в раздел Pupup Maker -> Все всплывающие окна . Ищем CSS Classes. Нас интересует код, такого вида: popmake-xxx.

Этот код нам нужен для, отображения окна при нажатии по ссылке, картинке или кнопке (говорил вначале).

Открытие окна при нажатии на картинку:

Открытие при нажатии на кнопку:

< button class = "popmake-xxx" >Открыть окно

Такой код можно вставлять где угодно (например, в статье или виджете). Разницы нет. Если будут возникать проблемы или вопросы — задавайте в комментариях, буду рад помочь.

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

На обновления, участвуйте в . До скорой встречи. Всем пока!

С уважением, Могиш Иван

Часто ли Вы замечали на сайтах всплывающие окна? Так, большинство интернет-ресурсов, особенно новостные и блоговые сайты, показывают посетителям всплывающие или попап-окна с той или иной информацией. Зачем они нужны вообще? Обычно их наличие помогает конвертировать посетителей в подписчиков (т.е. в постоянных пользователей). По данным интернет-маркетологов, наибольший процент конверсии приходится именно на всплывающие окна, если, конечно, они настроены правильно. Конечно, если такие окна будут “вылетать” час за часом перед глазами посетителя, то понятно, что он уйдет из такого сайта и не захочет больше возвращаться.

Как настроить всплывающие окна в WordPress?

“Движок”, по умолчанию, не предоставляет возможности создания и настройки всплывающих окон. Поэтому воспользуемся сторонним решением – бесплатным плагином Popup Maker .

Плагин Popup Maker

Итак, после установки и активации плагина, сразу видим окно приветствия. Для начала работы нажимаем кнопку Skip .

В итоге Вы попадаете в основное окно создания всплывающих окон.

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

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

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

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

Блок Показать настройки позволяет задать размеры попап-окна.

Настройка Отключить фон позволяет отображать или скрывать фон под всплывающим окном.

Блок Анимация позволяет задать Вашему окну скорость, а также эффекты анимации (затухание, увеличение и др.)

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

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

Наше всплывающее окно создано, и теперь можно смотреть на сайте.

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

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

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

Опыт использования подобных плагинов некоторыми владельцами сайтов на других ресурсах подтверждает, что количество подписчиков, к примеру, на e-mail рассылку может увеличиться на 500%.

Плагин WordPress Popup

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

Настройка плагина

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

Там вы найдете и шорткоды для отображения кнопок социальных сетей для Facebook, Google и Twitter. Внизу указаны параметры для этих шорткодов, так что вы можете добавить URL и другие параметры в кнопку:

Под параметрами шорткода находится бокс «Popup Display Rules » (Правила отображения всплывающих окон). В нем вы выбираете место на сайте, где должно появляться всплывающее окно - конкретная страница, тип поста, прочее.

И, наконец, есть бокс «Display Options » (Параметры отображения), в котором настраиваются все параметры внешнего вида всплывающих окон - призывы к действию, триггеры, анимации, фоновый цвет, наложение непрозрачности, цвет границы, прочее:

После настройки параметров нажмите на «Publish » (Публиковать), а затем на «View Post » (Просмотреть пост), и вы увидите, как работает всплывающее окно:

Функции плагина

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

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

Доступные настройки

• Выбор из пяти возможных местоположений всплывающего окна
• Триггеры-окна, всплывающие после N–го количества секунд пребывания пользователя на сайте или % скроллинга страницы
• Автоисчезновение всплывающего окна при возвращении пользователя вверх страницы
• Изменение цвета шрифта, фона, границ, прочее
• Настройка непрозрачности фона
• Суточный интервал в появлениях всплывающего окна

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

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

Заключение

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

В данной статье мы познакомим вас с плагином «WP-MK», позволяющий создать выплывающее окно на своём сайте WordPress.
«WP-MK» достаточно прост в применении и так же, как и такой плагин как вызывать особого раздражения не будет у посетителей блога. Поскольку появляется данное всплывающее окно лишь после прокрутки страницы сайта до низа (можно настроить) и будет исчезать если посетитель пролистывает , также имеется кнопка для закрытия такого всплывающего окна. Окно, которое отображает плагин «WP-MK», направлено может быть для того, чтобы решить самые разные задачи.

Настройка плагина «WP-MK»

Для того, чтобы настроить плагин «WP-MK» необходимо перейти в раздел «Параметры» в административной панели WordPress, дальше пункт «Всплывающее окно» и таким образом попадаем в настройку плагина.

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

Клик для увеличения

Один пункт, который необходимо отметить — «Содержимое». В это поле можно вставить нужный html-код, к примеру, на своём блоге в данном всплывающем окне отображается на анонсы свежих статей посредством сервиса feedburner, так же возможна размещение кода формы от сервиса Smartresponder, ну, в общем, что отображать в этом окне решать только вам. Не нужно забывать после внесения, каких-либо модификаций в настройках данного плагина нажать на «сохранить» внизу страницы.
Вот данное и все настройки, которые имеет плагин «WP-MK», все достаточно просто. Надеюсь, что «WP-MK» заинтересует вас и окажется для вас достаточно полезным.

С уважением, Андрей Юрийчук