Swap Multiple Images with Configurable Swatches

Question

I've got a question about the new lovely feature Configurable Swatches.

I am setting up a configurable product with Colour and Size options, and I have set it up so that when a Colour is selected in the options, the Base image is changed.

I have added two images to the Configurable product, and two images for every Simple product (for each and every size), hoping that when selecting a Colour option, both images for the Configurable product would change to the two images connected with the specific Colour option.

Unfortunately this does not work, only the first image of the Simple product is displayed, and I can still see the two Configurable images in the thumbnails.

What I would like is that, when selecting a Colour option, all images are replaced by the images I have uploaded for that specific Colour option. Does anyone know if this is possible?

I should add that I am working with the new Magento CE 1.9.1 with the default RWD theme.

Answer 1

I have built this, in a modular way. Will post the code on github soon.

It triggers on a JavaScript call and fetches the images with Ajax. So it does not effect page speed or caching system.

PM me if you want the code asap. Otherwise follow me on Twitter @willemwigman to hear when I post the code.

Edit: I've put the code on github https://github.com/wigman/AjaxSwatches

Answer 2

And Magento community to the rescue!

See https://twitter.com/willemwigman/status/543047966752538624 & https://github.com/wigman/AjaxSwatches.

This Module adds an Ajax event to the new ColorSwatches in Magento 1.9.1.0 When the event ConfigurableMediaImages.updateImage fires up, the original updateImage() function is executed. After this we make an AJAX request to [baseurl]+'ajaxswatches/ajax/update' requesting the MediaGallery images.

Answer 3

I recommend you this extension.
One of its features is what you need. It allows you to change the whole media section when you change the color (or any other attribute) displaying the images for the simple product.
See the documentation for the configuration to see how you can achieve this.
The extension was build for versions between 1.7 and 1.9.0.1. It works on 1.9.1.0 also. But I recommend disabling the core Color Swatches functionality if you use this extension.

Answer 4

Does anyone know if this is possible?

Yes, but it will require customization. The degree of customization is something I do not know.

Answer 5

https://github.com/wigman/AjaxSwatches

There is some problem with this extension in Magento 1.9.3.x.

Its not loading the media images on product view page.

I have to modify this function _loadOptionLabels in app/code/community/Wigman/AjaxSwatches/Model/Resource/Catalog/Product/Attribute/Super/Collection.php to make it work.

protected function _loadOptionLabels()
{
    return parent::_loadOptionLabels();
}