Guide to Setting Up Product Headers and Image Linking | Relume Community

Guide to Setting Up Product Headers and Image Linking

Hello everyone 👋 Does anyone know of a guide on how to best set up a product header (for example, “Product Header 1”)? I’m specifically looking for help with linking multiple images from product variants to the small preview thumbnails on the left. I’ve searched online but haven’t had much luck finding anything. Thanks in advance for any help you can offer! Wishing you all a great day!

5 comments

Markus M.
·
Matt J. Just pinging you here in case this message slipped through the cracks 😊
Markus M.
·
Matt J. Just pinging you again, I would like to link up the main image with the other small images, without using a lightbox. So that when one of the thumbnail images is clicked it becomes the primary image. The rest of the page I was able to setup, just this has me stumped :)
Matt J.
·
Markus M. ah thank you Markus - very sorry for missing this (twice!). I had actually looked at this on Thursday when you sent it and the conclusion I came to and could have sworn I answered was that you'd have to hook this up using custom code unfortunately. You could potentially look at using tabs to make this work - I was hoping to find some component in our library that would get you most of the way there but yeah. Most of the ecommerce stores you see that have this functionality are custom coded. You could try using ChatGPT to say something like "I have 6 image thumbnails and a main image, and when I click on one of the thumbnails, I want that image to become the new main image" and see what it gives you. I bet with about 15-20 mins using AI you'd have something useful.
Matt J.
·
to give the AI the same classes and everything that you are using, you could publish the site and right click inspect, and then find the HTML that makes up that section and paste that into GPT as well.
Matt J.
·
if you get stuck on any of my suggestions just let me know which route you want to go and I'd be happy to help further