Вход | Регистрация

JT Popup - модуль всплывающего окна

Имеет 2 режима работы:

  • Popup - всплытие с задержкой.
    При входе на сайт, через определённое время будет показано всплывающее окно.

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

Особенности модуля:

  • Есть возможность запоминать браузер пользователя, чтобы модальное окно показывалось через определённый промежуток времени, например раз в сутки или раз в неделю.
  • Возможность вставлять любой html, js и css код
  • Возможность вставлять контент через обычный редактор Joomla.
  • Возможность создания новой позиции, чтобы выводить модули внутри всплывающего окна.
  • Имеет 4 встроенных стиля окон, при этом можно изменять стиль окна под ваш проект.
  • Адаптивный

Подробнее смотрите в видео обзоре:

Видео обзор

Инструкция по работе с модулем JT Popup.

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

Настройки отображения модуля

Режим работы - выбирается режим работы модуля. Открытие с задержкой или по клику.

Запоминать браузером - включить установку куки в браузер, чтобы показывать окно через определённый промежуток времени.

На сколько запоминать - время жизни куки в секундах. 86400 секунд - это 24 часа.

Задержка - задержка показа popup окна в секундах. Рекомендую устанавливать значение более 10 секунд.

ID окна - задаётся ID для окна, если включен режим открытие по клику.

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

Стиль окна - выбирается стиль, тут на вкус и цвет) 

О том как изменить стиль под свой проект смотрите ниже.

модуль popup joomla

Добавление содержимого во всплывающее окно

В модуле существует 3 варианта добавления контента.

  1. Через окно "HTML и JS код" - при этом код не обрезается редактором
  2. Через стандартный редактор Joomla, кому то удобнее через него.
  3. Вставка другого модуля.

настройки модального окна для joomla

Про вставку через модульную позицию расскажу по-подробнее.

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

настройка модуля всплывающего окна joomla

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

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

 

Рекомендации по настройке модуля

Настройка окна в режиме Popup.

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

Также можно уменьшить время задержки, чтобы не ждать долго.

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

После окончательной настройки:

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

Настройка модального окна в режиме Click.
Открытие по клику.

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

Укажите нужный ID для окна.

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

Пример:

< a href="#ModalOpen"> текст ссылки 

Настройка стилей окон.

Если вы имеете хотя бы базовые знания по html и css, то сможете сами изменить внешний вид вашего окна.

Стили для окон заданы в файле /modules/mod_jt_popup/assets/css/default.css

там вы увидите селекторы типа:

#jt_popup1, ...2, ...3 - они соответствуют стилям окон.

Если в настройках модуля выбран стиль Style 3, значит нужно редактировать #jt_popup3

jt_popupX - это стиль для окна

jt_closeX - это стиль для кнопки закрыть

настройка стилей модального окна

 

И в самом конце css файла есть указание для мобильных устройств.
На всех устройствах, чей экран менее 800px, всплывающее окно будет занимать 85% ширины экрана.

При необходимости вы можете изменять значения под свои нужды.

гарантии

Личная гарантия.

- Вы ничего не потеряете, а наоборот получите много ценного и полезного.

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

- Если вас что-то не устроит или вы не получите пользы от приобретения, то в течение 30 дней вы можете вернуть 100% стоимости + 10% лично от меня за потраченное время.

С уважением, Олег Касьянов.

Комплектации

Standart

  • Модуль
  • PDF инструкция
  • Поддержка на форуме
  • 399 руб

    Купить

    Premium

  • Модуль
  • PDF инструкция
  • Поддержка на форуме
  • Оперативная помощь в настройке на вашем сайте
  • 1390 руб

    Купить

    С уважением, Олег Касьянов

    Сохраните эту информацию к себе, чтобы не потерять:

    С уважением, Олег Касьянов.

    Комментарии

    Оставьте ваше мнение

    *

    Получать уведомления о новых комментариях

    user

    Александр 09-03-2018 23:13:34

    Скажите, а будет ли реализована функция открытия окна при уходе посетителя с сайта?

    user

    Олег 09-03-2018 23:14:30

    Александр, пока не думал об этом. Но если найду время, то сделаю.

    user

    Igor 09-03-2018 23:15:31

    Добрый день. 2 вопроса
    1. установил без проблем, н только почему то не работает смена стилей :-( Установил тут http://new.tehlabkontrol.ru/ кнопка вверху с права "получить скидку".
    2. Как добавить в форму обязательный чекбокс "Даю согласие на обработку персональных данных *"

    user

    Олег 09-03-2018 23:20:19

    Здравствуйте, Игорь!
    1. Там из стилей только смена кнопки и форма окна. Остальное, при необходимости, можно задать самостоятельно.
    2. Если у вас используется модуль JT Lid form, то скачайте его последнюю версию, там можно добавлять html теги и вставлять нужные элементы под формой - https://joomlatown.net/module/modul-otpravki-zayavok-dlya-Joomla-3-s-vyborom-daty

    user

    Алекс 09-03-2018 23:23:04

    Скачал модуль pupup и также модуль заказ звонка с календарем. Настроил как у вас, но выводится пустое окно при клике в материале. Что я могу делать не так?

    user

    Олег 09-03-2018 23:23:43

    Вы наверное, не поставили модуль в позицию popup. В модуле она прописывается вручную, в списке позиций её нет. Ещё раз посмотрите инструкцию.

    user

    Владимир 22-05-2018 10:08:59

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

    user

    Олег 22-05-2018 11:52:13

    Для прокрутки указать св-во: overflow-y: scroll

    X

    Спасибо!
    Ваш комментарий появится после одобрения

    нашли ошибку? напишите
    X

    Вход

    Ваш e-mail:

    Ваш пароль:


    Забыли пароль?
    Регистрация

    X

    Нашли ошибку или баг? Напишите мне.

    placeholder="Опишите пожалуйста где вы нашли ошибку и какую, буду вам очень благодарен">

    ^ Наверх