Problem

In some themes (I’m using Astra theme in this case) the thumbnails on the single product page are blurry. This is because Woocommerce assigns the gallery image size, not the theme. This is not for all themes, some override the Woocommerce setting, but I needed this fix for Astra theme which rendered the gallery images blurry.

Solution

Adding this code to your child theme’s functions.php file will force the gallery thumbnail image sizes to render larger and make them crisp again. The actual gallery image does not get any larger, but the clarity is perfect.

/**
 * Thumbnails
 * Fixed pixelated gallery thumbs for woocommerce
 */

add_filter( 'woocommerce_get_image_size_gallery_thumbnail', function( $size ) {
	return array(
		'width'  => 400,
		'height' => 400,
		'crop'   => 1,
	);
} );