Streaming live at 10am (PST)

Custom Lightbox not using Webflow CMS

Hi all, I have a pretty specific question for creating custom lightboxes in Webflow. For most of my clients I need to export the WF code and convert the site to a WordPress theme, for multiple reasons: staying GDPR compliant, my client doesn’t want an own WF account bc it requires to pay with credit card, or my client simply already has a hosting plan somewhere else. I love building in Webflow but that’s why I mostly don’t use Webflow’s dynamic content.

I know how to use interactions in Webflow to create modules, but the issues is that that way my client would be stuck with a certain number of images in the Lightbox. My main issue here is the navigation once you open a Lightbox image (like going to next/previous module images.) In WordPress I would use an ACF repeater field to allow my client to add as many images to the Lightbox gallery as they want. However, then the navigation would not work anymore, bc in Webflow I would need to code the ‘previous’ and ‘next’ buttons dynamically and I don’t know how to do that. When I just set a static interaction that on click of the next button closes the current module and opens the next module, it won’t work once I export the code and connect it with a ACF repeater field. (The current module will still close on click but obviously not open the next module)

Another idea would be to open a Slider Element as the Lightbox but then I don’t know how to link each thumbnail image to the right slide in the Slider. I have read many approaches to this but didn’t really get them to work for my specific situation.

Can anyone help? Is there any javascript or jQuery code I can use to make that navigation work dynamically? Like on click, it triggers to close current module and opens the next module in line or something?