Тематика: По цвету: Красный Желтый Зеленый Синий Оранжевый Розовый Серый Белый Черный Мульти

Ваш сайт на CMS Joomla? Добавьте его в галерею Joomfans!

Вы можете совершенно бесплатно добавить ваш веб-сайт в нашу галерею сайтов. Подробнее...

Галерея Добавить

Главная Статьи Блог Установка и настройка интерактивного модуля галереи Art Image Cycle для Joomla 1.5.xx
Установка и настройка интерактивного модуля галереи Art Image Cycle для Joomla 1.5.xx

В данном уроке мы научимся использовать красивый модуль слайд-шоу для CMS Joomla 1.5.xx  Art Image Cycle


 

Для начала нам нужно установить модуль:

Расширения (рис.1) > Установить/Удалить (рис.2) > Выберите файл (рис.3)  > [Выбираем  архив (.zip)] (рис.4)  > Загрузить модуль и установить (рис.5)

 

Расширения (рис.1)

Изображение1

Установить/Удалить (рис.2)

Изображение2

Выберите файл(рис.3)

Изображение3

[Выбираем  архив (.zip)] (рис.4)

Изображение4

Загрузить модуль и установить (рис.5)

Изображение5

После установки мы увидим надпись “Модуль успешно установлен

Далее мы определяемся в каком месте он будет находится (module|модуль|позиция). Это можно сделать нехитрым дописыванием в строку адреса сайта /?tp=1.

Пример: http://www.(ваш сайт).com/?tp=1 (рис.6)

Изображение6

Далее мы увидим какие модульные позиции у нас есть.
В случае с http://www.joomla.org мы будем видеть: (рис.7)

Изображение7

После того как мы определились с позицией приступаем к самому интересному этапу настройке модуля.

Сначала, находим сам модуль.

Расширения (рис.1) > Менеджер модулей (рис.8) > [Ищем сам модуль] (рис.9)  > [Выбираем   модуль ]

Расширения (рис.1)

Изображение1

Менеджер модулей (рис.8)

Изображение8

[Ищем сам модуль] (рис.9)

Изображение9

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

Изображение10

Мы имеем поля:

Подробности

Тип модуля: mod_artimagecycle – системное название модуля
Заголовок: Art Image Cycle – данный заголовок отображается в названии модуля в админ панели (рис.9) и на сайте (рис.11)

В админ панели (рис.9)

Изображение9

На сайте (Лицевая панель)(рис.11)

Изобоажение11

Показать заголовок:   (да)  (нет)  - данный пункт предлагает включить отключить заголовок на сайте  ДА (рис.11)  НЕТ (рис.12)

ДА (рис.11)

Изобоажение11

НЕТ (рис.12)

Изображение12

Включен: (да) (нет)я думаю данная опция не требует комментария

Позиция:  - по умолчанию стоит позиция left . В этом поле мы указываем позицию

размещения модуля (рис.7).

Позиция модуля (рис.7)

Изображение7

Порядок: - порядок отображения модуля в списке в админ панели

Доступ: - включение - отключение доступа (зарегистрированным, не зарегистрированным, специальным)
ID:  идетенфикатор модуля

Назначение меню

Меню: - фильтр страниц на которых будет отображаться модуль

Выбор меню: - фильтр (точный выбор страниц) работает только при включённом режиме (выбрать из списка)

Параметры

Path (Путь)путь к папке с изображениями (родительская папка images/)

Пример: images/stories/foto/(вложенные фото .jpg .png)

Материалыданная опция позволяет настроить внешний вид самого модуля.

В нашем модуле есть СSS стили через которое мы и будем настраивать внешний вид модуля

.pics

{ height: 180px; width: 180px; padding:0; margin:0; overflow: hidden }

Свойство padding позволяет задать величину поля сразу для всех сторон элемента или определить ее только для указанных сторон.
Свойство margin позволяет задать величину отступа сразу для всех сторон элемента или определить ее только для указанных сторон.
Свойство overflow управляет отображением содержания блочного элемента, если оно целиком не помещается и выходит за область заданных размеров.

.pics img

 { height: 150px; width: 150px; padding: 15px; border: 1px solid #ccc; background-color: #eee; top:0; left:0 }

Универсальное свойство border позволяет одновременно установить толщину, стиль и цвет границы вокруг элемента.
background-color  - Определяет цвет фона элемента.
moz-border-radius - Устанавливает радиус скругления уголков рамки для Mozilla
webkit-border-radius - Устанавливает радиус скругления уголков рамки для Webkit браузеров

EffectВыбираем эффект смены картинок  (выпадающий список)

Timeoutвремя задержки одной картинки (указывается в миллисекундах/ms)

Transition speedвремя смены картинок (Effect)  (указывается в миллисекундах/ms)

Load jQuery libraryзагрузка библиотеки jQuery

Ну вот и все, мы научились настраивать и использовать модуль Art Image Cycle

Спасибо за внимание!


 

Литература

8 видеоуроков по…

На днях популярная и известная студия по разработке шаблонов и…

Joomla!…

Если вы часто создаете сайты на CMS Joomla! 1.6, 1.7 или 2.5 то вы…

10 легких шагов к…

Прочитав книгу Хагена Графа «10 легких шагов к освоению Joomla! 3.0»…

Joomla! 2.5 -…

Книга «Joomla! 2.5 - Руководство для начинающего пользователя»…

Инструменты

Akeeba SiteDiff

При создании сайта, всегда есть вероятность того что он будет взломан…

Morph Framework

Последняя обновленная и уже совершенно бесплатная версия фреймворка…

CodeLobster PHP…

Очень мощный и многофункциональный редактор РНР, HTML, CSS,…

JB Zen Grid Framework…

Последняя обновленная версия фреймворка Zen Grid от студии…