Seperate lightbox images

Hi all,

I’ve managed to create a layout i like which uses CMS to create more cards whenever i add a new product. (See image)
The problem i am running into is:
When the fullscreen button is clicked, it displays ALL images from the collection, instead of just the one from the selected card.
Is there a way i can seperate the lightboxes?


(Link to website)
https://preview.webflow.com/preview/gemstone-advanced-concepts-group?utm_medium=preview_link&utm_source=dashboard&utm_content=gemstone-advanced-concepts-group&preview=32a7f8318ae66c8f4d14ee2fa0164ae5&workflow=preview

I can’t remember for certain if I’ve tried it with ECom, but this is the solution I built for the CMS-driven lightbox groups in general.

well the first thing i see when loading the page is a red notice telling me it’s not compatible with e-commerce :rofl:

Oh yeah, I have tried it then :laughing:
So the problem is that ECom doesn’t support data-binding on attributes, which makes it difficult to expose your group identifier for the SA5 library to consume.

You’re kind of stuck- it would take some custom coding to pull that, and some modifications to my lib.

You can message me if you need that built, but the best / cheapest approach is probably just to avoid lightboxes in your multi-product page view, and use lightboxes only in your single product page view. Not ideal, but it sidesteps these Webflow limitations.

Yea i think it’s best to move the lightbox to the single product page.
Might delve into a custom coding solution, but i doubt i’m skilled enough to make it work lol.
Thanks for the assistance!

Good work, I like it.