Community forum for knowledge and support

Updated 2 weeks ago

Gallery 9 component

At a glance
The community member is looking for an approach to create a layout with a view all photo feature that opens a modal with a gallery using Relume. Another community member suggests that the exact layout already exists in an ecommerce component that can be adapted. The community members discuss issues with the close button and accessing the second-level modal in the designer, and provide a work-in-progress link to troubleshoot the modal placement.
Useful resources

How would you approach a similar layout with the view all photo opening a modal with the gallery using relume?

Gallery 9 component seems to be a good candidate

Attachment
Screenshot 2025-02-27 at 22.07.30.png
Marked as solution

@Falko Piguet we have this exact layout already - its just in an ecommerce component but you could grab it from here and adapt accordingly.
https://www.relume.io/preview?cid=product-headers/section_product-header2

View full solution
M
F
11 comments

@Falko Piguet we have this exact layout already - its just in an ecommerce component but you could grab it from here and adapt accordingly.
https://www.relume.io/preview?cid=product-headers/section_product-header2

ok that's awesome, never thought about looking into this section! thanks Matt

hi @Matt

Thanks again for the suggestions, really liking it.

The component looks great! just two things:

  • I think the close button on the image modal is broken, I can see the close interaction exists but it's not linked to it (or I messed it up which is very likely)
  • how do I access the second-level modal in the designer? -> if you click on a photo while scrolling the image gallery modal, it opens another image gallery slider.

https://www.frankmartin.ch/en-ch/rental/animi-voluptatem

If you want to see work in progress (I also need to figure out how to put the modal on top of the navigation bar, it might be why the button is actually not working?)

@Falko Piguet Would you mind sending a read-only link?

hi @Matt

Sure here is a link

I connected the interaction to the close button on the first modal and added some margin on top so it doesn't get stuck under the nav bar. Not ideal, opened to better options πŸ™‚

I am still stuck on the third level modal on the CMS item detail page "rentals template"

Hi @Matt did you have a chance to take a look? Thanks!

the second image modal is a webflow native lightbox. You'd just link it to the same CMS field or to a multi-image field. In the close interaction make sure to change this setting. It looks like the easing or timing of the close has been edited quite a bit - I would maybe look at another close interaction settings to see how to bring it back to how it was.

Attachments
image.png
image.png

ok thanks! Weird I haven't touched the interaction settings, just linked it back. I'll have a second look πŸ‘

hmm okay interesting

btw amazing work on pre-setting all the finsweet CSM attributes, it really cuts through the necessary work, pretty awesome

Add a reply
Sign up and join the conversation on Slack