I have two swatches.. color and size. Is there a way to stop the size swatches from reloading the picture of the product and keep the color swatch working as usual?
Ty!
Magento Stack Exchange is a question and answer site for users of the Magento e-Commerce platform. It only takes a minute to sign up.
Sign up to join this communityProduct images are changed by default js file Magento_Swatches/js/swatch-renderer.js
on click of swatch options, below is the responsible function for it-
/**
* Load media gallery using ajax or json config.
*
* @param {String|undefined} eventName
* @private
*/
_loadMedia: function (eventName) {
var $main = this.inProductList ?
this.element.parents('.product-item-info') :
this.element.parents('.column.main'),
images;
if (this.options.useAjax) {
this._debouncedLoadProductMedia();
} else {
images = this.options.jsonConfig.images[this.getProduct()];
if (!images) {
images = this.options.mediaGalleryInitial;
}
this.updateBaseImage(images, $main, !this.inProductList, eventName);
}
}
There is another function _OnClick: function ($this, $widget, eventName)
which is triggered on click of swatch option and this function calls function _loadMedia
causes changes of product images.
So you need to do necessary amends in this file as per your requirement after copying it into your vendor/theme folder.