Shuffle.js - как подключить lightbox.
 

Всем привет. Подключил к своему шаблону плагин фильтрации и сортировки контента shuffle.js Однако теперь думаю как внедрить какой-либо lightbox плагин чтобы при нажатии на картинку открывался lightbox. Вот точный пример того, чего пытаюсь добиться https://www.uwierzby.pl/galeria/

В данный момент на моем шаблоне работает обычная фильтрация контента без lightbox как тут https://vestride.github.io/Shuffle/

Ньюанс подключения состоит в том, что lightbox, должен быть привязан к дата-атрибутам shuffle.js (пример data-groups='["all","animal","space"]' ). То-есть выбрав картинку, которая относится к пункту фильтрации "animal" - lightbox должен перелистывать именно те картинки, относящиеся к данному пункту фильтрации.

PS: В сети на codepen и jsfiddle примеров с кодом не нашел. Заранее благодарю за ответы!

<a href='images/image-1.jpg' rel="lightbox[animal]"><img data-groups='["all","animal","space"]'></a>

у лайтбокса вроде есть группировки по атрибуту rel="lightbox[ИМЯ ГРУППЫ]"

и если тут https://www.uwierzby.pl/galeria/ точный пример, можно посмотреть как у них устроено все.

Подключил lightbox http://lokeshdhakar.com/projects/lightbox2/#options. добавил ссылки с data-атрибутами.

Однако прописывал rel="lightbox[ИМЯ ГРУППЫ]" (rel='lightbox["all","animal"]'), но это не работает. Однако работает другой вариант <a href="images/image-2.jpg" data-lightbox="animal">Image #2</a> Таким образом можно указать к какой группе относится лайтбокс.
Однако в data-lightbox указывается только одна группа, а не несколько как в shuffle.js

Собственно в data-атрибутах можно группы перечислять или нет???

Стандарт не запрещает, а нужны они там или нет, читайте документацию вашего лайтбокса