Pull to refresh

Drupal 6. Примитивная галерея CCK+ImageField+ImageCache+Lightbox2

Reading time 3 min
Views 4.4K
Это небольшая статья (или мануал, если угодно) о создании примитивной галереи посредством дополнительных модулей. Сам взялся за изучение друпала трое суток назад. Должен сказать, что после WordPress’а это сложновато, но вникнуть и разобраться можно. Поехали.



В первую очередь спасибо всем хабралюдям, которые помогли написать не в свой блог. Большое человеческое спасибо!

Если у вас не установлен Drupal (drupal-6.8), качаем систему с друпал.орг и параллельно качаем следущие модули:
CKK, FileField, Lightbox2 dev (обязательно версию для разработчиков!), ImageAPI, ImageField, ImageCache. Надеюсь, не надо объяснять, что эти модули нужно скопировать в /sites/all/modules/ и включить (зависимости можно посмотреть на странице с модулями).

Идём в Administer/Site Building/Modules, включаем
В блоке CCK:
Content, Content Permissions, FileField, ImageField, Text
В блоке Core Optional:
PHP Filter
В блоке ImageCache:
ImageAPI, ImageAPI, GD2, ImageCache, ImageCache UI
В блоке Other:
Lightbox2
После включения модулей переходим в Administer/ Site Building/ImageCache и жмём на Add new preset.
В текстовое поле формы Preset namespace вводим img_120x120, потом сохраняем: Create New Preset. Выбираем на открывшейся странице действие для обработки фотографии. Я выбрал Add Scale (это масштабирование с пропорциями), выбираем после выбора действия на страничке наш размер – width: 120, height 120. Жмём Add Action, пресет готов.

как должно получиться:
ImageCache

ImageCache

Переходим в Administer/Site configuration/Lightbox2.
Вкладка General:
Ставим птички на Force visibility of navigation links и на Continuous galeries
Вкладка HTML Content:
Поставьте свои размеры большой фотографии или оставьте по умолчанию (600x400)
Вкладка Automatic image handling
Image node settings:
Automatic handler for image nodes меняем на Lightbox grouped
Inline images
Automatic handler for inline images меняем на Lightbox grouped
Сохраняем (Save configuration)

Переходим в Administer/Content types и выберем из операций manage field рядом с пунктом Story. Добавим новое поле:
Label: imgsrc
Field name imgsrc
Select a field type: image
Нас перебросило на страницу поля. Оставляем всё по умолчанию. Кроме:
File path: это путь внутри директории files, куда будут копироваться закачанные изображения, можно поставить imgsrc. Number of values – кол-во полей для закачивания фотографий – ставим Unlimited. Сохраняем (Save filed settings).

как должно получиться:
manageFields

Переходим в Display fields.
В Teaser меняем значение Generic Files на Lightbox2: img_120x120->original
В Full node меняем значение Generic Files на Lightbox2: img_120x120->original

как должно получиться:
DisplayFields

Теперь создадим материал типа Story
Create content->Story
Title: Test gallery 01
Body: можно не заполнять
Блок imgsrc
New upload, выбираем файлы (по умолчанию два поля для загрузки, но можно нажать add another item и сделать их сколько угодно). Выбрав фото, жмём Upload (на каждой фотографии). Настройки ниже можно не трогать. Дальше кнопка Save. Собственно на этом всё. Осталось сделать небольшие изменения по отображению превьюшек.
Идём в Administer/Site building/Blocks и создаём новый блок.
Block Description: Gallery CSS
Block title: Block body:
<?php
drupal_add_css('sites/all/themes/image-style.css','theme');
?>


Input format: PHP code
Сохраняем (Save block). Регион для созданного блока выбираем Header

как должно получиться:


Теперь сделаем css-файлик со следущими данными:
div.odd, div.even {float: left; margin-right: 5px; }
div.field-label {display: none; }

На этом всё, ковыряйтесь в настройках: сделать можно всё, что угодно. Удачи

UPD Большое спасибо ivlis за live preview.
Tags:
Hubs:
+8
Comments 30
Comments Comments 30

Articles