Cегодня я рад представить еще один модуль Joomla для демонстрации под названием JT SlideShow. Как и все предыдущие, этот модуль имеет лицензию GPL, т.е. распространяется бесплатно (мир не без хороших людей…) и любой желающий может использовать его для украшения своего сайта.
Модули Joomla для демонстрации. Часть 4. JT SlideShow.

Хороший сайт должен всегда радовать глаз, при этом быть информативным и не содержать лишнего. Отличным способом показать суть сайта являются картинки, меняющиеся с течением времени, или по-другому слайдшоу. Я уже рассказал о трех отличных модулях, позволяющих добавлять к сайту подобную функциональность. Но т.к. на вкус и цвет товарищей нет, серия статей продолжается, и сегодня я рад представить еще один модуль Joomla для демонстрации под названием  JT SlideShow. Как и все предыдущие, этот модуль имеет лицензию GPL, т.е. распространяется бесплатно (мир не без хороших людей…) и любой желающий может использовать его для украшения своего сайта.

Начну рассказ о JT SlideShow я, пожалуй, с благодарности разработчику. Ему в подарок, как и другим, ссылкас Wedal.ru. Сайт на турецком языке, но гугл легко переводит страницы. Если вам понравится JT SlideShow, можете заглянуть на сайт к разработчику, и посмотреть другие, созданные им расширения.

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

Модуль JT SlideShow позволяет показывать изображения, используя множество эффектов библиотеки jQuery. Особенностью данного модуля является то, что он имеет большое количество опций, позволяющих тонко настроить отображение слайдшоу. Эта особенность является одновременно и достоинством и недостатком модуля. Большое количество настроек – это всегда хорошо. Больше опций – больше возможностей. Но при этом они значительно усложняют сам процесс настройки модуля, поскольку долго приходится разбираться? что за что отвечает. Чтобы вы могли сэкономить время, рассмотрим все настройки  JT SlideShow.

Настройка JT SlideShow.

Все настройки JT SlideShow разделены на 3 группы:

  • параметры модуля;
  • дополнительные параметры;
  • другие настройки.

Рассмотрим каждую группу отдельно.

Настройка JT SlideShow. Параметры модуля.

Параметры модуля показаны на рисунке:

 
1-JT
 

Image Folder – папка из которой будут показываться изображения. По умолчанию, указана папка «modules/mod_jt_slideshow/photos», в которую добавляется 5 изображений при установке модуля;

Show All Images – если выбрано «Да», будут показаны все изображения, содержащиеся в папке из предыдущей опции. Если «нет», то только определенные в следующей опции. Допустимые форматы изображений: jpg, gif, png.

– Изображения – введите в этом поле названия файлов изображений. Все изображения должны быть расположены в папке из первой опции. Если вы хотите использовать изображения из других папок или из Интернета, используйте перед названием вставку <ext>. Примеры:

<ext>another/directory/image.ext

<ext>http://sitename/folder/image.ext

Titles – заголовки для изображений. Чтобы они отображались опция «Image Caption» должна быть установлена в «Показать»;

URLs – ссылки для изображений. Чтобы ссылки работали опция «Linked URLs» должна быть активирована;

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

Linked URLs – если активировано, в изображения буду вставлены ссылки из опции «URLs»;

Target – определяет в каком окне откроется сайт при переходе по ссылке;

– добавлять http:// перед ссылкой. Выберите «Да», если ссылки ведут на другие сайты;

Image Caption – показывать или нет заголовки изображений, заданные в пункте «Titles»;

– Caption Position – расположение заголовков;

– Caption Align – выравнивание заголовков;

Настройка JT SlideShow. Дополнительные параметры.

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

 
2-JT
 

Transition Effect – эффект перехода между изображениями. JT SlideShow имеет 27 различных эффектов переходов между изображениями. В настройках модуля можно выбрать либо их все, либо только один. Если вы хотите выбрать несколько эффектов, то в файле modules\mod_jt_slideshow\helper.php измените 16-ю строчку:

$this->fx = $params->get ( 'fx', 'all' );

на:

$this->fx = 'scrollLeft,scrollDown,scrollRight,scrollUp';

где 'scrollLeft,scrollDown,scrollRight,scrollUp – выбранные эффекты.

Timeout – время показа каждого изображения в миллисекундах;

Speed – скорость перехода между изображениями в миллисекундах;

Delay – дополнительная задержка при показе первого изображения в миллисекундах. Может быть отрицательной;

Speed In – скорость входа транзакции;

Speed Out – скорость выхода транзакции;

Shuffle – координаты анимации для эффекта перетасовки. Есть некоторые эффекты, в которых изображения как бы «улетают». Здесь можно задать дальность и направление полета изображений. Пример: top:15, left: 200

Pager Event – при каком событии изображения будут переключаться: клик или наведение курсора. По умолчанию при кликах по кнопкам навигации и уменьшенным изображениям большая картинка переключается. В этой опции можно установить переключение при наведении курсора на элемент управления;

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

Random – если активировано, изображения будут показываться в случайном порядке;

Fit – подгонять изображение под контейнер;

Container Resize – изменять размеры контейнера для подгонки больших изображений;

Pause – пауза в слайдшоу при наведении курсора на слайд;

Pause On Pagination – пауза в слайдшоу при наведении курсора на номера слайдов;

Auto Stop – автоматическая остановка слайдшоу после показа всех слайдов;

– No Wrap – предотвращать свертывание;

– Randomize Effects – эффекты переходов показываются случайным образом;

– Reverse – показывать эффекты анимации в обратном направлении;

Настройка JT SlideShow. Другие настройки.

Другие настройки модуля показаны на рисунке:

 
103-JT
 

– Load jQuery – загружать jQuery. Если на вашем сайте есть еще расширения, использующие jQuery, выберите «нет»;

– Box Name – если вы хотите использовать более одного модуля JT SlideShow, задавайте им здесь разные имена;

Image Width – ширина изображений слайдшоу;

Image Height – высота изображений слайдшоу;

Image Border – рамка вокруг изображения;

– Image Border Size – размер рамки в пикселях;

– Image Border Color – цвет рамки;

Navigation Bar – показывать панель навигации (стрелочки вправо и влево);

– Navigation Bar Position – расположение панели навигации;

– Navigation Bar Border – рамка вокруг панели навигации;

– Navigation Bar Border Color – цвет рамки панели навигации;

Show/hide pagination – показать/скрыть разбиение на страницы;

Pagination Bar Position – позиция разбиения на страницы;

Pagination Bar Align – выравнивание разбиения на страницы;

Pagination Bar Border – рамка вокруг разбиения на страницы;

Pagination Bar Border Color – цвет рамки вокруг разбиения на страницы;

Pagination Items Border – рамка вокруг цифр разбиения на страницы;

Gallery – показывать галерею мини-изображений (как на демо). Если данная опция активирована, необходимо отключить отображение разбиения на страницы!

– Gallery Width – ширина галереи;

– Gallery Position – расположение галереи;

Gallery Direction – направление галереи (слева направо или справа налево);

Thumbnail Box Width – ширина окна мини-изображения. Не путайте ширину окна мини-изображения с шириной мини-изображения. В первом случае это размер, в который будет вписано мини-изображение без изменения размеров. Т.е., например, если мини-изображение имеет размер 500х500px, а ширина и высота окна мини-изображения 50х50px, то в окне мини-изображения будет показан лишь кусочек мини-изображения размером 50х50px;

Thumbnail Box Height – высота окна мини-изображения;

Fit Thumbnails – подгонять мини-изображения под рамку; Специально для примера, описанного выше;

Thumbnail Width – ширина мини-изображения;

Thumbnail Height – высота мини-изображения;

Thumbnail Space – расстояние между мини-изображениями. Здесь нужно указывать желаемое расстояние между мини-изображениями, разделенное на 2, т.к. оно откладывается от каждого мини-изображения, и суммарное расстояние получается в два раза больше;

Thumbnail Border – рамка вокруг мини-изображения;

Thumbnail Border Size – размер рамки мини-изображения;

– Thumbnail Border Color – цвет рамки мини-изображения;

– Show footer – показывать под модулем его название.

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

Об авторе
Об авторе
Wedal (Виталий). Веб-разработчик полного цикла (Full Stack). Создатель и автор сайта Wedal.ru.
Основной профиль – создание сайтов и расширений на CMS Joomla.

Добавить комментарий

Для отправки комментария введите код с картинки:
Защитный код
Обновить

Комментарии  

+8 # Денис 09.03.2010 21:13
Красавчик!!! Все доступно описано, респект тебе!!!!!
Ответить | Ответить с цитатой | Цитировать
0 # Александр 12.03.2010 05:07
Что говорить модуль хороший
а автору статьи спасибо за описание
Ответить | Ответить с цитатой | Цитировать
0 # Dim Dim 13.03.2010 05:36
можно ли этим модулям вывести галереи к каждой новости свою отдельную галерею?

НАПРИМЕР фильм /кадры из фильма

если знаете помогите пожалуйста разобраться или посоветуйте альтернативу для задач такого рода
Ответить | Ответить с цитатой | Цитировать
+1 # Wedal 14.03.2010 07:24
Dim Dim, можно если копировать модуль в менеджере модулей, задать ему уникальную позицию (вписав ее название в настройках модуля, вместо выбора из выпадающего списка), а затем вставить в статью: {loadposition имя_уникальной_позиции}. Таким образом модуль будет вставлен в статью и вы сможете задать для него уникальные изображения. Правда есть у этого способа и недостаток: если статей много придется создавать большое количество модулей.
Ответить | Ответить с цитатой | Цитировать
0 # Dim Dim 19.03.2010 05:10
да такой вариант обдумывал но контента планируица многа видимо придеца искать алтернативу) просто модуль очень понравился спасибо за предложенный вариант:)
Ответить | Ответить с цитатой | Цитировать
0 # Александр 18.03.2010 16:40
Здравствуйте, не устанавливается этот модуль, версия сайта joomla 1.5.13, пишет:

* JFolder::create: Невозможно создать каталог
* Внимание! - Не удалось переместить файл

Подскажите в чём может быть проблема?
Ответить | Ответить с цитатой | Цитировать
0 # алексей 31.03.2010 20:52
Ошибка! Не найден XML-файл установки Joomla! вот мне чито пишет как установить?
Ответить | Ответить с цитатой | Цитировать
0 # Евгений 16.04.2010 06:03
а подскажите пожалуйста каким модулем у вас реализована показа картинок на сайте.. так красиво всплывают...
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 16.04.2010 06:06
Евгений, ищите плагины для Joomla с названиями lightbox или Rokbox.
Ответить | Ответить с цитатой | Цитировать
0 # Рина 18.05.2010 18:10
Здравствуйте! Очень хороший модуль... а был бы еще лучше, если бы начали слушаться эти два свойства - не реагируя на изменения все время изображение подгоняется под размер картинки, исажаясь разумеется...
Неужели только у меня эта заморочка...
Хелп...
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 19.05.2010 06:08
Рина, подробнее.
Ответить | Ответить с цитатой | Цитировать
0 # Константин 31.05.2010 10:56
не получается установить на сайте версии 1.1.5
что можно сделать?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 31.05.2010 13:00
Константин, для начала корректно задать вопрос. Что такое "сайт версии 1.1.5"?
Ответить | Ответить с цитатой | Цитировать
0 # will 27.07.2010 00:30
Здравствуйте! Пытаюсь вставить модуль в одну статью два раза,с разными фото.Сделал копию,назвал позицию user,но фото не отображаются,сам модуль работает,а копия не хочет,на сайте отображается только загрузка копии модуля,помогите пожалуйста разобраться.
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 27.07.2010 04:39
will, это вполне возможно. Скорее всего конфликты. Вообще, не советую использовать несколько слайдшоу на одной странице. Это конкретное издевательство над браузерами и компьютерами посетителей. У многих пользователей со слабыми компьютерами эта страница будет сильно тормозить. Если все же нужно организовать нечто подобное лучше использовать либо отдельные картинки, либо оформлять серии в видео и вставлять видеовставки.
Ответить | Ответить с цитатой | Цитировать
0 # will 27.07.2010 10:34
Спасибо за ответ! Не могли бы Вы рассказать о настройках модуля для демонстрации Art Sexy Lightbox Lite Edition.
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 28.07.2010 03:04
will, возможно. Но не раньше, чем сам с ним познакомлюсь :-)
Ответить | Ответить с цитатой | Цитировать
0 # will 10.08.2010 15:28
Спасибо! Ваш сайт очень помог мне сделать отличную фотогалерею и хочу от себя добавить,что для вставки модулей в материалы есть отличный плагин Modules Anywhere,который облегчает процесс вставки модуля в статью вне зависимости от позиции модуля в шаблоне сайта,с помощью всего одной кнопки внизу редактора.
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 11.08.2010 07:43
will, спасибо. А если еще и напишите про него статейку, с удовольствием опубликую ее на сайте. :-)
Ответить | Ответить с цитатой | Цитировать
0 # Alex 15.08.2010 13:37
Автору статьи спасибо за описание.
Load jQuery – выберите Нет.
В этом случае модуль НЕ РАБОТАЕТ (Если – Да, работает).
jQuery подключен в хедере.
Добаввление jQuery.noConflict(); не помогает.
- jQuery is not defined Source File: /jquery.cycle.all.min.js Line: 10
- jQuery is not defined Source File: /jquery.easing.1.3.js Line: 39
- jQuery is not defined Source File: /jquery.easing.compatibility.js Line: 11
- jQuery.fn.cycle is undefined Source File: /mysite/Line: 405
Подскажите, как в данном случае правильно подкючать?
Спасибо.
Ответить | Ответить с цитатой | Цитировать
0 # Zhekin 13.01.2011 00:43
Спасибо за статью, все понятно и доступно. Возникла необходимость редактировать списки Изображения и Titles автоматизированно (не средствами Joomla), подскажите, пожалуйста, где храняться эти данные, в каких файлах или таблицах?
Заранее спасибо
Ответить | Ответить с цитатой | Цитировать
0 # misterz 10.03.2011 19:37
Установил модуль в joomla версии 1.6 на денвере. При запуске выдается ошибка

Using $this when not in object context in Z:\home\joomla16\www\modules\mod_jt_slideshow\helper.php on line 16

Подскажите в чём проблема?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 11.03.2011 05:08
misterz, эээмммм, а модуль не от Joomla 1.5 случайно?
Ответить | Ответить с цитатой | Цитировать
0 # misterz 11.03.2011 08:28
Цитирую Wedal:
misterz, эээмммм, а модуль не от Joomla 1.5 случайно?

Вот начало xml файла


JT SlideShow
Ümit Kenan Gönüllü
February 2010
Joomla! Türkçe Eğitim ve Destek Sitesi
GNU/GPL

www.jt.gen.tr
1.6
DESCSLIDESHOW

Тут фигурирует и 1.5.0 и 1.6. Но скорей наверное 1.5
Ответить | Ответить с цитатой | Цитировать
0 # misterz 11.03.2011 08:32
Извиняюсь, за некорректный вывод кода. Там вторая строчка

install type="module" version="1.5.0
Ответить | Ответить с цитатой | Цитировать
0 # wmze2011 07.10.2011 18:39
Этот модуль может выводить разные скрины по разным категориям?А так все прекрасно
Ответить | Ответить с цитатой | Цитировать
0 # WASP 20.10.2011 11:25
Добрый день.
Друзья, помогите чайнику плиз.
Ситуация следующая.. Модуль встал нормально, место ему определил. При включении заголовок выводится, картинка не грузится. папку указал:images/stories/food; картинки: bread.jpg и bun.jpg. Чтото не так делаю?? :sigh:
Ответить | Ответить с цитатой | Цитировать
0 # bagun 24.11.2011 14:01
Здравствуйте, у меня почему то не грузятся картинки, крутится кружочек загрузки и все без изменений, даже если все по умолчанию оставить ничего не происходит, в чем может быть дело?
Ответить | Ответить с цитатой | Цитировать
0 # bagun 25.11.2011 06:52
Цитирую bagun:
Здравствуйте, у меня почему то не грузятся картинки, крутится кружочек загрузки и все без изменений, даже если все по умолчанию оставить ничего не происходит, в чем может быть дело?

Я кажется разобрался, там у меня в коде библиотека jquery уже была подключена для выпадаюещго меню, этот модуль подгружает свои библиотеки jquery которые видимо конфликтуют с моей, пришлось удалить и все заработало)))
Ответить | Ответить с цитатой | Цитировать
0 # ден3333 15.03.2012 16:57
спасибо за статью и прекрасный модуль! правда столкнулся с проблемой, иногда не отображается одна из фотографий, просто пусто на позиции модуля и потом опять запускается показ. как лечить?
Ответить | Ответить с цитатой | Цитировать
0 # Сергей777 30.10.2013 05:37
Здравствуйте. Есть ли готовое слайд-шоу, где с одного слайда можно указывать несколько ссылок на разные страницы?
Например, на слайде 3 телефона, при клике на разные телефоны ссылка разная, как на aukro.ua (3 и 4 слайды)
Ответить | Ответить с цитатой | Цитировать