My free templates and extensions for CMS Joomla!

Всплывающее окно с модулем, картинкой, видео, текстом на Joomla 2.5

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

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

И так, перейдем от слов к делу.

Для этой цели я использую плагин из комплекта Widgetkit под названием Lightbox, это самое удобное решение которое я нашел на данный момент. Качаем данное расширение с официального сайта, там есть бесплатная версия комплекта Widgetkit Lite (Free), для наших целей нам этого хватит.

Качаем и устанавливаем как обычное расширение Joomla, далее заходим по меню админки в Расширения / Widgetkit и смотрим чтоб плагин Lightbox был включен.

Сейчас давайте посмотрим пару способов вывода контента в всплывающее окно.

Вывод изображения:

 

<a data-lightbox="width:600;height:600;"href="/images/img/myimage.jpg"><img src="/images/img/myimage.jpg"alt=""  width="290px;"/></a>

 

"width:600;height:600" - это у нас размер всплывающего окна, width="290px;" - размер миниатюры.

Вывод текста:

 - Первая часть кода

<div style="display: none;  "> <!--Контейнер скрывающий блок -->  <div id="myblok_name" style="width: 460px; height: 550px; overflow: auto; color:#000000; "> <p>Тут любой контент вставляем</p> </div> </div>


- Вторая часть кода

<a data-lightbox href="#myblok_name">Ссылка</a>

 

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

Вывод любого модуля:

Мы знаем что для вывода модуля в статье мы используем встроенный плагин Joomla Loadmodule, смотрим в плагине описан синтаксис вывода "Загружает модули, опубликованные в определенной позиции в текст материала (cинтаксис: ) или отдельный модуль по названию (синтаксис:\{loadmodule mod_login\} без знака "\"). Дополнительно можно задать стиль отображения и произвольный заголовок модуля (если используется loadmodule), я думаю вы с этим знакомы уже. Я думаю вы уже догадались как вывести любой модуль, правильно!!!, используем код из примера с текстом.

 - Первая часть кода 

<div style="display: none;"> <!--Контейнер скрывающий блок -->  <div id="myblok_name" style="width: 460px; height: 550px; overflow: auto; color:#000000;"> <p></p> </div> </div>


 - Вторая часть кода

<a  data-lightbox  href="#myblok_name">Ссылка</a>

 Вот и все.

Need for free Joomla templates? Then you were not in vain in the spaces of our resource. By using our site you get to download for free template for the site on various subjects, which is operated by CMS Joomla. You will choose a template for an online store, information, advertising and corporate site template for your portal. Large selection of universal joomla templates for any type of sites. With free templates and extensions for CMS Joomla on our creative club JT you will make your site visually appealing and functional. All templates are designed to use your site easily and conveniently. Your site visitors will be easier to use your resources and find information.

Avid Gamer? Check out our friends @ Game Supply for the latest from Gamers!

Creative Club Jtemplate.ru always goes to the front and constantly growing and evolving, so our catalog Joomla templates and extensions will be consistently updated. Leave your comments on the functioning and quality of the templates. So You can read ebooks visiting ebooksread.com

Welcome to jtemplate.ru