Configurable product image resolution issue

Question

I'm having an issue with configurable product swatch on my category view page (in grid mode).

We are using image in 420px in our category page but the image that are automatically switch with the swatches sources are in 210x.

All the product images source are coming from the getProductImageFallbacks() function from the configurable swatch Core (Block/Catalog/Media/Js/Abstract.php)

But i am stuck on how to change the resolution there. Really looking for any advice on where to go from there.

Please note that i sadly cannot go the easy way with a css fix due to image quality.

Answer 1

I was basically overthinking it.

The solution is dead simple:

1. Go to Configuration > Catalog > Product Image
2. Change the product Small Image Width to the width you need
3. Clear cache
4. Voila

Answer 2

Basically it depends on the theme. For my case as I am using a custom theme from themeforest.net and the product images in category product list page are vertically rectangle like 245x344px dimension. But when on swatch box click the product image is loading through jQuery, it's getting the size from configuration settings and loading square image of that size like 245x245px which is wrong for me.

So I've just removed width from configuration settings and now it's loading the base image and it's rectangle now. It's just for my solution. Hope it'll help to someone else. Thanks