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

Скачать исходники для статьи можно ниже

Данный плагин есть на wordpress.org:

Последнее обновление: 2012-11-22

Загрузок: 35,196 – пока скромненько.

Автор: Yannick Lefebvre

Сайт плагина: http://yannickcorner.nayanna.biz/wordpress-plugins/modal-dialog/

Установка стандартная – заходим в панель управления, в левом меню выбираем пункт “Плагины” и его подпункт “Добавить новый”, в строку поиска вводим “Modal Dialog”.

Устанавливаем и активируем плагин, после чего в левом меню вашей панели управления появиться новый пункт “Modal Dialog”, который будет находится ниже пункта “Настройки” (“Параметры”), данный пункт имеет 2 подпункта:

– Modal Dialog General Settings (Общие настройки). Здесь вы можете задать показывать или нет модальное окно в мобильных браузерах, а также указать количество модальных окон. Но в большинстве случаев данный подпункт оставляем по умолчанию и переходим сразу ко второму.

– Configurations (Конфигурации). Здесь остановимся по подробнее.

Пройдемся по основным параметрам:

“Активировать” (Activate) – можно отключить показ модального окна на сайте, поставив значение NO (по умолчанию YES)

“Содержимое источника” (Content Source) – здесь выбираем, что будет показываться в модельном окне: либо какой-нибудь сайт (его url указывается в параметре “Адрес веб-сайта” (Web Site Address)), либо остальное (параметр “Диалог Содержание” (Dialog Contents)).

“Внешний вид задержки (в миллисекундах)” (Appearance Delay (in milliseconds) по умолчанию стоит 2000, что равно 2 сек, то есть модальное окно будет появляться на вашем сайте через задержку в 2 сек после открытия посетителем странички вашего сайта.

“Диалог ширина” (Dialog Width) – ширина модального окна по умолчанию 500 px.

“Диалог высота” (Dialog Height) – высота модального окна по умолчанию 700 px.

“Наложение цветов” (Overlay Color) – это цвет затемнения фона на заднем плане при появлении модального окна, по умолчанию стоит какой-то болотный зеленый цвет, рекомендую поменять его, например на черный: #000000

“Количество дней до окончания работы куки” (Number of days until cookie expiration) – количество показав модального окна для посетителя записывается в cookies, то есть он определяет через какое количество дней будет вновь показано модальное окно для посетителя.

По умолчанию стоит 365 дней, если вы хотите показывать модальное окно раз в неделю, то поставьте цифру 7, раз в день – 1.

Также есть параметр “Количество раз для отображения модальных диалоговых” (Number of times to display modal dialog) – он задает количество показов модального окна за период жизни куки, то есть если у вас в параметре “Number of days until cookie expiration” стоит 7 дней, а в данном параметре 10, то за неделю модальное окно будет показано 10 раз, причем подряд при каждой просмотренной странички.

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

– если только на главной страничке, то находим параметр “Отображение на главной странице  (Display on front page)” и ставим галочку

– если мы хотим показывать модальное окно еще и на других страничках, записях, то необходимо найти параметр “Только показать на конкретных страницах и одного сообщения (Only show on specific pages and single posts)” и поставить галочку, далее в параметре “Страниц и сообщений для отображения модальных диалоговых  (Pages and posts to display Modal Dialog)” нужно указать id страничек или постов, которые хотите показывать.

Чтобы узнать id странички или записи нужно зайти в “Редактор” соответствующей записи и в адресной строке браузера найти id, например:

http://mnogoblog.zz.mu/wp-admin/post.php?post=12&action=edit

Ищем post=12, значит id=12.

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

Для этого есть параметре – “Отображение после нового комментарии, размещенном (Display after new comment posted)” – ставим галочку, если хотим воспользоваться данной функцией.

Все остальные параметры можно оставить по умолчанию.

Как сделать, чтобы модальное окно закрывалось автоматически через определенное время?

Для этого вам нужно поставить галочку в параметре “Auto-Close Диалог” (Auto-Close Dialog), что заставить окно закрываться.

Также вам нужно отрегулировать параметр “Auto-Close время (в мс) ” Auto-Close Time (in ms)” – здесь также используются миллисикунды, по умолчанию стоит 5000 = 5 сек.

Перспективное применение модального окна.

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

Flash страничку можно создать самому, но для этого нужно будет изучить достаточно много материала и потратить свое драгоценное время, а можно воспользоваться услугами студий Веб-дизайна, которые обеспечат вам создание красивой анимации или отдельной Flash странички, а если нужно и создание всего сайта на Flash. И чтобы все это не обошлось вам в слишком большую сумму, предлагаю воспользоваться вам специальным сервисом “Купонатор”.