Галерея на Друпал (Galleria, jCarousel, LightBox2)

 

Сегодня я расскажу, как сделана галерея у меня в блоге. Точнее у меня не совсем галерея, скорее посты-фотоальбомы. Но примрно по той же схеме я сейчас буду делать фотогалерею для сайта aeromake.ru. Так что будут не только инструкции, но и при необходимости - скриншоты :)

Итак. Для того, чтобы сделать галерею нам надо запастись модулями:

  • Taxonomy (вероятно он уже у вас есть)
  • Content Template
  • Image Cache (и все, что он скажет нужно в зависимостях)
  • Galleria
  • LightBox2

Для модуля есть еще jCarousel views, его можно опционально использовать, если оформлять главную страницу раздела (у меня это будет страница фотогалерея) - может пригодится.

Качаем модули, устанавливаем. И пирступаем к созиданию.

ВАЖНО! Для обработки изображений модулем ImageCache используйте библиотеку GD2. ImageMagic неадекватно себя ведет даже на никсовых серверах, а на виндовом денвере - вообще может помереть. Настраивается это в настройках модуля ImageAPI.

Сначала надо сделать тип материала. Назовем, его, допустим, "Фотоальбом". Идем в раздел админки: Администрирование › Содержание › Типы материалов (http://www.yousait.ru/admin/content/types), добавляем тип материала, и переходим к управлению полями.

Добавляем поле "фото" название филда, тип - файл > изображение. Сохраняем. После этого будет предложено установить параметры этого поля. Ставим:

В общих настройках: количество - не ограничено, список (отключено), описание поля - как хотите, у меня оно будет включено, чтобы можно было делать комментарии к фотографиям.

Теперь нужно сделать словарь для наших фотоальбомов. Идем в Администрирование › Содержание › Таксономия (http://www.yousait.ru/admin/content/taxonomy). Добавляем словарик и термины. У меня будет примерно так:

Идем в настройки ImageCache - для красивого отображения нам понадобятся пресеты. Я сделала три штуки - для превьюшек, для вывода фото большого размера, и еще один пресет - для оформления блоков (нечто вроде обложки альбома). Делать пресеты естественно лучше в соотвествии с концептом дизайна - на aeromake.ru, скажем, все иконки  и превьюшки будут квадратные или прямоугольные с загругденными углами, на моем блоге - квадратные или прямоугольные со светлыми рамочками.

Теперь идем настраивать модуль Galleria. Сюда: Администрирование › Настройка сайта › Galleria Settings. В настройках указываем пресеты, для jquery ставим включено, скорость по умолчанию стоит fast, я обычно меняю на slow или medium.

Можно еще подключить Lightbox2 туда же - тогда у пользователей будет возможность открывать поверх окна сладйер с оригинальными изображениями. Либо как вариант - сделать, для самого большого формата - 800х600, для того чтобы листать в теле страницы - по ширине страницы, и превьюшки. Это уже зависит от вашей задумки и фантазии. Я пока Lightbox2 на aeromake.ru не включаю, поскольку сайт находится в стадии построения основной структуры, лайтбокс мне на этом этапе будет несколько мешать, а вот когда дело дойдет до наведения "марафета" - обязательно включу :)

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

А вот теперь можно добавить пробных альбомов, а потом приступить к тюнингу самого раздела. Про это будет в следующем посте.

И не забудьте выставить права для просмотра данного типа материала, пресетов, и галереи для пользователей.

Автора автора

Комментарии