How can I display a different product image based on the collection page being viewed

Hi,

I sell tiles for the home which can be used in bathrooms, kitchen and other locations.

Currently if I have a wall tile that can be used as both a bathroom or kitchen tile I create two separate collections (bathroom wall tiles and kitchen wall tiles) and have this product display in both collection.

however the collection currently displays the first image for the product. I want to know, if I have multiple images that feature a bathroom or a kitchen, can I select which image is shown for that collection so the image is relevant.

My idea was maybe to have the word contained in the image name so for example 1 would be red bathroom wall tile and another red kitchen wall tile , and then have the collection display the relevant image for that product if it contains that word in the name.

I’m currently using the empire theme by pixel union so easy to test the code before applying to a live site.

If my idea isn’t suitable I was then considering using metafields as the output for the image but don’t really want to make the process too manual and more automated based on rules and setting.

Any help on a solution will be appreciated.

Thanks

1 Like