Обучение

04 Август 2008

Как использовать YOOgallery

Опубликовано в Обучение, Joomla

Установка (на примере Joomla 1.5)

Специально для тебя я выложил все компоненты, плагины и модули входящие в YOOtools одним архивом.
Устанавливаем (Administrator ->Extensions -> Install/Uninstall Upload Package File -> Выбираешь архив с плагином-> Upload file & Install -> Done -> Upload Package File -> Выбираешь архив с модулем-> Upload file & Install) все, что необходимо и включаем плагин и модуль! Готово.

Настройка

  • Стиль: Lightbox (открывается всплывающее окно) и Slideshow (изначально есть окно в котором отображаются фотографии)
  • Тип слайдшоу: Fade (постепенное исчезновение), Wipe (эффект вытирания), Slide (скольжение) и Random (произвольный из первых трех)
  • Стиль мини изображения: Default (стандантое), Polaroid (в виде фотографии прикрепленной скотчем), Rounded (закругленные края, внимание: изначально закругляет края белым цветом), Cutted (обрезанная фотка) и Plain (фотка в маленькой рамочке)
  • Порядок мини изображения: Ascending (прямой), Descending (обратный), Random (случайный)
  • Эффект Spotlight на мини изображении: Yes | No
  • Ширина мини изображения: в пикселях
  • Изменение размеров мини изображения: Yes | No
  • Префикс мини изображения: thumb_
  • Кэш директория с мини изображениями: thumb
  • Время хранения кэша мини изображений: 1440
  • Загружать Lightbox: Yes (если не используется YOOeffects)| No (если используется YOOeffects)

Использование

Пример использования ты можешь увидеть у меня в фотогалерее из России.

Принцип работы YOOgallery прост до безобразия и безумно приятен: из загруженных, на ФТП, фоток автоматически делаются мини изображения и все это добро выкладывается на сайт с помощью плагина.
Сначала ты отбираешь фотки, которые хочешь опубликовать на сайте. Переименовываешь их (так как заголовок фотографий будет браться из названия) и загружаешь в папку images/xxx, где xxx-название альбома английскими буквами без пробелов. Теперь создаешь материал, в котором прописываешь следующее: {.yoogallery src=[/images/xxx/]}(без точки в {} перед yoogallery), нажимаем сохранить и готово.
Ну, разве не здорово добавлять целую фотогалерею двумя движениями?

29 Июль 2008

Как использовать YOOeffects

Опубликовано в Обучение, Joomla

Сегодня я расскажу тебе, что такое YooEffects, зачем он нужен и почему я им пользуюсь.
YOOeffects – это коммерческий плагин (или мамбот для ранних версий) CMS системы Joomla. Этот плагин накладывает различные эффекты на изображения используя библиотеку Mootools.

Что бы увидеть действие этого плагина на моем сайте, необходимо залогиниться. Так как он включен только для зарегистрированных пользователей. Можно зарегиться с нуля или же ввести логин и пароль от Gmail’a и не мучаться.

Установка

Буду описывать установку на версию Joomla 1.5.xx (аналогично устанавливается и 1.0.xx).
Administrator -> Extensions -> Install/Uninstall
Upload Package File -> Выбираете архив с плагином -> Upload file & Install
Успешная установка.
Administrator->Plugin Manager ->YOOeffects -> Разрешаем к публикации
Поздравляю, наш плагин готов к работе!

В этот плагин встроено 3 эффекта:

Lightbox

При нажатии на объект (текст, картинка и т.п.) отрывает объект в специальном Лайтбокс окне. Объяснить сложно, поэтому вот пример:
Логотип этого сайта (фон у картинки получается черный, потому что она прозрачная, делай выводы)



Итак, что бы использовать этот эффект, нам нужно в тэг <a> вписать rel=”lightbox;width=xxx;height=yyy;” (где xxx – значение ширины, yyy – значение высоты), например <a rel=”lightbox;width=300;height=200;” >.
Если хочешь сделать галерее подобный пост, нужно вместо lightbox вписывать lightbox[xxx], где xxx- некое название. Например: rel=”lightbox[tanki];”. После этого под окном лайтбокса появятся надписи Previous и Next.

 

Spotlight

Эффект spotlight заключается в том, что одно изображение плавно заменяется другим. Примером может послужить логотип этого сайта, который изменится на фотографию Артемия Лебедева, если ты, конечно, залогинен.
Этот эффект накладывается на теги <div> и <span> в которых может быть прописан фон.
Пример:


Пример <div> тэга:
<div class="spotlight" style="background: url(http://www.kolyan.cz/images/logo2.png); “ width=”420” height= “120" ></div>

Пример <span> тэга:
<span class="spotlight" style="background: url(http://www.kolyan.cz/images/logo2.png); display: block;" width=”420” height= “120"></span>

Вторая картинка, на которую заменяется фон, должна называться так же, как и первая, только с добавлением _spotlight. Например: logo2.png и logo2_spotlight.png.

 

Reflection

Этот эффект представляет собой генерацию отражения к изображению программными средствами.

Что бы воспользоваться этим эффектом, необходимо прописать в тэг <img> класс: class=”reflect”.
Enjoy!

<<  1 [2