featherlight gallery shows images of all page folders?
Hi, I have a modular page. My images in different page folders using lightbox effect. I activated gallery mode in featherlight plugin. So this works. Now all images of all page folders with lightbox effect are shown in gallery. I want only to show those images in gallery that are in one page folder. So the gallery should work for a single page folder and not for all page folders. Is this possible? Another point: On a modular page it is not possible to override featherlight settings in page headers. Not working, no effect.
You would have to manipulate the script that initializes the featherlight gallery. That's a quite easy task as soon as pull request https://github.com/getgrav/grav-plugin-featherlight/pull/11 is approved ;-)
Then you just would have to make sure to identify the links that belong together and work with a init script like this:
$('#elementWrapper_1 a[rel=lightbox]').{pluginName}({
openSpeed: {openSpeed},
closeSpeed: {closeSpeed},
closeOnClick: '{closeOnClick}',
root: '{root}',
});
Setting a different rel attribute than 'lightbox' when creating a lightbox link would make it even easier, I think. But that's currently not possible with the grav core since the rel attribute is hard coded at the moment.
I am also trying to create a gallery template but I think I'm not quite there. I have created a folder with images and metadata
01.Images
|- gallery.md
|- image1.jpg
|- image1.jpg.meta.yaml
|- image2.jpg
|- image2.jpg.meta.yaml
gallery.md has the following template gallery.html.twig:
{% extends 'partials/base.html.twig' %}
{% block content %}
{{ page.content }}
{% for image in page.media.images %}
{{ image.lightbox(1024,768).cropResize(200,200).html(image.meta.title) }}
{% endfor %}
{% endblock %}
This sort of works, each image is shown sequentially and activates the lightbox However, I'd like to be able to then proceed to the next image in a gallery. How would one do this?
Ideally, I'd like to have the featherlight gallery working on and image collage like https://github.com/petrgrishin/grav-plugin-image-collage
However, I'd like to be able to then proceed to the next image in a gallery.
Your code works for me well. The next image button appears when you hover the mouse over the edge of the image.