How to replace the first item in a list of images

Need help
1

I have a form where you can edit products, I have my product page set up in a way as there is a “Main Image” data field and an “Images” data field, the Main image and the first image of the list of images should be the same in order for it to be displayed.

I can replace the main image but I cant seem to understand how to allow the user to replace the first image only from my list of images.

Thank you!

2

Here’s how you could set this up in Bubble:

  1. Update the Main Image: Add a button or file uploader for users to update the “Main Image.”

  2. Sync the First Image in the List: In the same workflow that updates the “Main Image,” add an action to update the first item in your “Images” list:

Use :set list item # and select item #1, then set it to the new “Main Image.”

  1. Display: Make sure your page shows the “Main Image” directly. This setup will keep the “Main Image” and the first item in the “Images” list in sync.

This way, every time the “Main Image” is updated, the first image in the list will automatically match it.

3

I really Appreciate your answer, I will try it out tmr seperately, I managed to make it work for now after hours. What I did was:

I first removed item #1 from the list, then i added the new list into a field called temporaryimages, then i removed the whole list from the images field, then i added the picture uploaders value into images, then i added the list back from temporaryimages into images.

It works but it took 6 steps in my workflow, do you think its more efficient doing it your way or should i just call it a day doing it this way? Efficiency and performance wise of course.

Thanks again for the reply!

1 Like