I volunteer for a local non-profit. The web page will be a list of the names of donors. Many donors contributed “in memory of” or “in honor of” someone. Those donor names will be an active link that, when clicked, is supposed to pop open a remote image (like in a modal window or single-image Lightbox), possibly with a caption (not really necessary), and an “X” in the corner to close the modal/lightbox. Here is an early concept: https://www.ridgetoplakesconservancy.org/honorific/
The numbers represent placeholders for donor names. All of the links pop the same image in this concept page, but in reality each link will pop a unique remote image. This actually works (thank you ChatGPT) – The modal is generated by html code on the page with some page-specific JavaScript. But I cannot get my custom code to work at all break points and I would much prefer to use stacks for the whole process.
The reason I went the coding route is because I couldn’t figure out how to do this just using stacks. I am using F2 “linked list” stack for the linked donor names. The F2 modal stacks (Modal and Mega Modal) can only be triggered by either a button or an image, so not by clicking a linked-list item. But I want clicking the link to call a modal or single-image Lightbox. If I knew of a gallery stack which allows a link to open a specific image (and only that image) in a Lightbox, that would work, too. Can anyone point me to specific stacks that might get me there? Thank you in advance!
I must be setting up something wrong in Limelight. Here is a page on which I only have the Foundry2 Theme and Foundry2 Control Center and minimal stacks: BareBones LimeLight | Ridgetop Lakes Conservancy
I trying to troubleshoot, in the Images Lightbox Settings, if I turn Lazy Preload off, my remote images download and show. So, those links work. If I set the images to Open on Page Load, then the Lightbox with images appear appropriately when I reload the page in RW preview. But when I test the links as I have them configured on my linked-list items, or test buttons created using html code, or a test text field in Limelight Launcher, they all fail. I am certain it is something simple, but I have not been able to figure it out.
Firstly, that JS is not mine and nothing to do with Limelight. My guess is that its something that has been pasted in somewhere as it has an unbalanced number of left and right parentheses (there is a missing closing ) ) hence the error when it encounters the closing script tag.
That aside, to launch a limelight, all you need to do is to assign a custom class to whatever you want to launch it from. That custom class is the content ID of the child stack. You don’t need the main limelight ID at all to launch a Lightbox - it is just used to link navigation bars and to distinguish different limelights on the page when you need more than one collection of light boxes.
So to launch your first Lightbox, you would just give a custom CSS classname of 01-image to any stack via its settings. You can of course use the limelight launcher if you want but it is not needed.
From your page, it looks like you have concatenated the Limelight ID with the Content ID
@tav You are the best! That’s exactly what I had done. I figured it was something insanely simple. I only had launcher and buttons and html on the page in an attempt to troubleshoot things. Thank you for setting me straight!