Drupal → Простая галерея с AJAX листалкой на Views

14.01.2011

Дано:

Тип материала Галерея (gallery) с дополнительным полем Изображения (field_images), в которое возможно загрузить неограниченное количество файлов. Поле создано с помощью ImageField. Так же создан ImageCache пресет gallery_thumbs для вывода превьюшек изображений размером 160x160.

Задача:

При просмотре галереи вывести превьюшки изображений разбитые на страницы, которые можно листать с помощью AJAX листалки Views. Превьюшки кликабельны и ведут на полные версии картинок:

Галерея с AJAX пейджером с помощью Views

Необходимые модули:

Views, для вывода постраничного списка изображений с AJAX листалкой.
Views attach, для вывода изображений в материалах определённого типа.

Решение:

  1. В настройках отображения полей у материалов с типом "Галерея" отключаем вывод поля "Изображения" (скриншот), оно будет генериться с помощью Views.

  2. Создаём представление с именем gallery_images и типом Файл (скриншот).

  3. В созданное представление добавляем взаимосвязь Содержимое: Изображения с именем Изображения и отмеченной опцией Эта связь обязательна (скриншот).

  4. Добавляем аргумент Материал: Nid, в качестве связи выбираем созданную ранее взаимосвязь Изображения (скриншот).

  5. Добавляем поле "Содержимое: Изображения (field_images)" с убранной опцией "Группировать множественные значения" и форматом "gallery_thumbs изображение со ссылкой на исходное изображение" (скриншот).

  6. В основных настройках представления изменяем стиль на Сетка, включаем мини пейджер и AJAX функции (скриншот).

  7. Добавляем вид Содержимое материала (скриншот).

  8. В типах материала указываем Галарея (скриншот). Этим мы добавили в галереи вывод представления.

  9. Сохраняем представление.

Написанное актуально для
Views 6.x-2.x
Похожие записи

Комментарии

с дополнительным полем Изображения (field_images), в которое возможно загрузить неограниченное количество файлов.

как и можно ли в такой схеме к каждой картинке добавить еще несколько полей?

у картинок можно включить alt, title и description

А почему автора не устроило обычное представление с полем типа field_images -> оригинал изображения | ссылка на страницу,
с тем же аяксом и листалкой?

что понимается под "обычным представлением"? если это views с типом Материал, то листалки по файлам там не появится, плюс без Views attach представления нельзя подключать к материалам. Если у вас получилось, скиньте код экспорта на pastebin.com

Так-с, разобрался. Да, именно такую вьюху я имел ввиду.
Совершенно проглядел в посте, что все картинки прикреплены к одной ноде, и тем не менее: листалка по приаттаченным изображениям + ajax.

Включены следующие модули: http://pastebin.com/eGUuWEq7
Экспорт вьюхи: http://pastebin.com/u4GRSqtC
Дамп ФС и БД моей тестовой установки друпала к себе на локальный сервер:
http://ifolder.ru/21385525
Скриншот.

Да, работает! Когда пробовал сам, то почему то упорно не появлялась листалка. Но в итоге получается, что единственное отличие от моего способа это не нужно добавлять взаимосвязь. Хотя преимущество представления по файлам - это возможность вывести инфу о файле, например имя или размер.

спасибо за проделанную работу :)

Самому интересно было =)
Да я и сам понимаю, что моё решение не из лучших (лучше всего, я думаю, это специально заточенный модуль).
AJAX в Друпале вообще капризная штука, может поэтому у вас и не выводилось :)

Сергей
10.04.2011, 16:12

Здравствуйте! В одном проекте столкнулся с необходимостью иметь две таких галереи. Картинки лежат в разных нодах типа gallery. Но views добавляет к каждой ноде определенного типа один и тот же набор картинок. Не подскажете, как изменить ваш views, чтобы выбрать картинки из определенной галереи и добавить к определенной ноде? Нужны аргументы или фильтры?

вопроса не понял. если нужны аргументы - используйте аргументы, если нужны фильтры - соответственно фильтры

Сергей
10.04.2011, 17:18

Я бы использовал, но не пойму, как можно использовать аргумент в данном случае. Буду думать.

София
28.10.2011, 18:07

Прикрученный к такой галерее Fancybox почему-то не хочет показывать навигационные кнопки и выполнять навигацию... Не подскажете почему?

Благодарю.

София
28.10.2011, 18:10

Во всплывающем окне плагина(Fancybox) с увеличенным изображением есть стрелочки "вперед-назад".

София
29.10.2011, 15:39

Прощу прощения, а не подскажете как в процессе темизации добраться до ссылок на картинки? Не могу определить, какой функцией они формируются или в каком шаблоне можно изменить этот вывод. Нашла только вывод img.

Гость
29.10.2011, 15:43

Может проблема в том, что я не совсем понимаю, с какой стороны подходить: темизировать поле типа или поле в представлении...

Гость
03.03.2015, 19:16

у картинок можно включить alt, title и description

никак не могу обнаружить эти поля во views, поля активированы в типе материала и заполнены

Гость
06.03.2015, 19:06

в общем, я так понял поля title, alt не показываются в представлениях, выводить можно только через темизацию соответствующего поля

Александр
31.03.2015, 19:37

в общем, я так понял поля title, alt не показываются в представлениях, выводить можно только через темизацию соответствующего поля

Да в стандартных полях не вывести, можно и через темизацию, но можно проще:
В настройках поля изображения "ПЕРЕЗАПИСАТЬ РЕЗУЛЬТАТЫ"
ставим галочку "Заменить выводимое полем значение"
И там с помощью токенов делаем нужную разметку и пользуемся подстановочными шаблонами, вот список, в нем в том числе и title, и alt есть:

[title] == Содержимое: Заголовок
[body] == Содержимое: Body
[field_image] == Содержимое: Image
[field_image-fid] == Сырая колонка fid
[field_image-alt] == Сырая колонка alt
[field_image-title] == Сырая колонка title
[field_image-width] == Сырая колонка width
[field_image-height] == Сырая колонка height

Добавить комментарий