I'm using Expresso Store & Channel Images Modules and I want to change the image being shown based on the colour variation chosen by the customer. eg. when selecting the blue shoe a blue show image is shown, when selecting red a red shoe image is shown etc.

I'm sure I can work out a way to do this using a naming convention or such like, but I was hoping someone might be able to suggest a way to do this more natively.

Many thanks

  • 1
    I think a naming convention is probably the way to go. Jan 14, 2013 at 17:26

2 Answers 2


I doubt there is way to do this natively. You'd need to look at a naming convention to match the variation name to the image as you noted and jQuery to do the switchout.

I have an example on a non-Store site that may help you get started. The image switch on this site happens when you click on the thumbnails at the bottom left of the product detail.

This tutorial offers another way of doing the swap with jQuery.

Here is another tutorial: Swaping images in jquery on select dropdown action

  • Thanks Anna & Justin - i figured it would have to be like that, but just wanted to make sure!
    – Tomtids
    Jan 17, 2013 at 13:50

As Anna has mentioned there is not a way to do this by default with the Store tags. You would need to do it with jQuery to swap the images. I would recommend that you use the Modifier Variable Pair to output the option_name to create an element that you could link with your jQuery. You wouldn't want to use option_idas it would be unique for every modifier option in the system.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.