Lightbox linking

Hi there,
can anyone help me please, I would like to link my lightboxs to repeater image
or is there a way to have lightbox links in collection box and link them from there to the repeater
thanks
Ravinder

Hey Ravinder,

You can keep the Lightbox name for each image in a collection. In the contents of each Repeater item in the onItemReady() event handler, you save the Lightbox name in a hidden field in the Repeater item and set an onClick() event handler for the image. The onClick() event handler will retrieve the Lightbox name from the hidden field and then open that Lightbox. The Repeaters onItemReady() should look something like this:

$w("#myRepeater").onItemReady( ($item, itemData, index) => {
   const repeatedText = $item("#hiddenText");
   const repeatedImage = $item("#repeatedImage");

   repeatedImage.src = itemData.img;
   hiddenText.text = itemData.lightbox;

   repeatedImage.onClick( (event) => {
      wixWindow.openLightbox(hiddenText.text);
   } );
} );

The above code snippet is only for illustration. It hasn’t been tested, but it shows how you might set up your Repeater to accomplish what you want to do.

I hope this helps,

Yisrael

sorry for this but i am going to need alot more than this i wish i was a programmer

I have around 110 items in collection database and I have created same number of lightboxes
All i want to do is link each one of those lightboxes to the corresponding items in the database or repeater

is there a url for each light box as there is for a page so i can use that as url option in the database

thanks

A Lightbox does not have a URL - it is a popup box on the page itself.

You don’t want a Lightbox for each item - you would need 110 of them. The correct way to do this would be to create a Lightbox that contains the necessary components (image, buttons, text, repeater, etc) to properly display the item information. Then when the user clicks on an item in the repeater, the Lightbox is opened with the item.

You will need to familiarize yourself with basic coding concepts to accomplish what you want. There are a wealth of Javascript coding sites which will help you learn Javascript from basic to advanced - Javascript.info is a good one. The Wix Code Resources page provides tutorials, examples, and articles on getting the most out of Wix Code. We are happy to get you pointed in the right direction, but you’ll need to take it from there. As questions or difficulties arise, we are here to help.

You may also want to check out the WixArena - it’s a hub where you can look for Wix Code (and other) experts for hire.

hi Yisrael,

I got the following code in and its kind of working, its takes around 2 minutes to open the lightbox and it always opens the same one. I got the hidden text on the image linked to database column in wihch all the lightbox names are listed

Please view following link and then wait for lightbox to appear, you will see all the lightbox names on top of the image

https://ravinderjassar.wixsite.com/malwahomes/HomeDesigns

Any suggestion please

export function dynamicImageClick(event) {

$w(“#repeater1”).onItemReady( ($item, itemData, index) => {
const repeatedText = $item(“#hiddenText”);
const repeatedImage = $item(“#repeatedImage”);

repeatedImage.src = itemData.img;
repeatedText.text = itemData.lightbox;

wixWindow.openLightbox(repeatedText.text); 

} );
}

You are using the dynamic pages incorrectly. For a detailed explanation see the article Wix Code: About Dynamic Pages . A dynamic page is for displaying dynamic content from a database without the need for a separate, dedicated page for each database item.

You will need to change your approach to your web site structure. For example, you can set up a page for Home Designs on a standard page, and use a repeater to show all of the content. You can also apply filters to the database query to only display certain items. Then, from each repeater item you can open up a dynamic page for that specific item. Or, instead of using a dynamic page, you could open up the content in a Lightbox. It’s your choice, but the dynamic page is designed to be easier to implement.

Good luck

You have many errors and an incorrect site structure. This is why it takes so long to open a Lightbox. For example, see the console errors:

Hi Yisrael

I have repeater set up on this page https://ravinderjassar.wixsite.com/malwahomes/HomeDesigns and elements linked back to database and filtering options, it works fine and always have. I did have dynamic items page linked to repeater image as well, I had it disconnected because i was trying to get lighbox to connect to repeater image.

So you could see it working i have reconnected it, please check it.

you have said in your comment i could open up content in lightbox but how to do it, how do i link repeater so when repeater image is clicked a lightbox opens, so far I have gone 3 wix experts listed on your site and they are unable to help

So again my request is when i click on repeater image instead of going to item page i want a lightbox to popup

is their anyone out there who can help

thank you

Ravinder

@ravinderjassar You have a repeater on the HomeDesigns dynamic page. It would be better to have it on a standard page and not a dynamic page. Standard pages can have repeaters and will work more reliably for your needs.

Your repeater is connected to the HomeDesigns dataset, and you are performing a query and then setting the data property of the Repeater to the results of the query. It is incorrect to do both.

You can open a Lightbox, but you should understand that you will need code to fill in the content on your own. It doesn’t work like a dynamic page.

To open a Lightbox, you will first need to implement the Repeater’s onItemReady() event handler which will assign an click event handler to each repeater item. This is where you will have the code to open a Lightbox.

As you can see, what you want to do is not trivial. Please understand that if you are going to work with code extensively in the product and not just the features in the user interface, you will need to familiarize yourself with basic coding concepts to accomplish what you want. We are happy to get you pointed in the right direction and get you started with what the code should look like, but you’ll need to take it from there.

You may also want to check out the WixArena - it’s a hub where you can look for Wix Code (and other) experts for hire.

Thanks for your understanding.

Hello - is there a way to link a lightbox in a repeater? I am showing a section of team members and I want to be able to click the name and have a bio pop up without taking them off of the page. How can I do this?

To open a Lightbox, you will first need to implement the Repeater’s onItemReady() event handler which will assign an onClick event handler to each repeater item. This is where you will have the code to open a Lightbox .

Please add your own issue into a new post instead of bumping up an old post. Explain what you are trying to do, what works, and what doesn’t. Also, add any code in a code block as stated in the Forum Guidelines .

This is an old post and is being closed.