Сегодня я расскажу, как сделана галерея у меня в блоге. Точнее у меня не совсем галерея, скорее посты-фотоальбомы. Но примрно по той же схеме я сейчас буду делать фотогалерею для сайта 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 не включаю, поскольку сайт находится в стадии построения основной структуры, лайтбокс мне на этом этапе будет несколько мешать, а вот когда дело дойдет до наведения "марафета" - обязательно включу :)
Чуть не забыла. Идем в типы материалов - управлять полями - показать поля. Выбираем для краткой аннотации и полного поста нужные виды вывода полей.
А вот теперь можно добавить пробных альбомов, а потом приступить к тюнингу самого раздела. Про это будет в следующем посте.
И не забудьте выставить права для просмотра данного типа материала, пресетов, и галереи для пользователей.
Комментарии
Опубликовано Чт, 21/04/2011 - 14:44 пользователем Анонимный (не проверено) Постоянная ссылка (Permalink)
Карусель не работает
Здравствуйте, огромное спасибо, отличная галерея.
Но у меня проблемка, не работает карусель!
что делать?
Опубликовано Вс, 01/05/2011 - 23:12 пользователем wshurik Постоянная ссылка (Permalink)
В блоге откуда взята статья
В блоге откуда взята статья (слка снизу) сейчас проводяится открфтый фак, попробуйте задать вопрос там
Опубликовано Чт, 06/10/2011 - 23:31 пользователем Анонимный (не проверено) Постоянная ссылка (Permalink)
Я не найду где вообще загрузить фото,хотя до меня админ загружал
Я не найду где вообще загрузить фото,хотя до меня админ загружал. И все старые материалы говорят об этом.