Hello Code Savy Webflowers,
So I have implemented this into my client’s website, I had to take a slightly different route because my gallery coming from multiple image fields from a single collection submission as opposed to referencing multiple submissions to the same collection. It still works, however I hit a roadblock I can’t seem to get around.
My gallery is formed using image submission fields, however they are not required. Some galleries use all 26 image submission fields, but most use far less. In order for my gallery to display correctly, I have conditions on each div set to only be visible if the image is set, therefore if there are only 3 images in the gallery, only 3 images show up and so on. However, even with the condition on the div that is housing my custom code, AND applying the condition to the custom code div itself, for some reason, a blank box for all the images that are supposed to be hidden shows up in my lightbox. I see blank thumbnails for images that are not actually there, and when you try to scroll into or click on one of the blank boxes, you get a spinny thinking wheel that won’t go away.
I’m guessing there is hopefully some additional code I can add that would keep the hidden images hidden within the lightbox, but I’m not a coder, and have no idea where to even start to look for this.
Here’s an example page of one of the galleries that I’m talking about:
As you can see, this particular piece uses only 12 of the 26 possible detail images, but when you click on a thumbnail and see it in the lightbox, you can see all the blank images that mess up my lightbox.
Any ideas on something I can do to make the lightbox only show the images that are actually there?