A second product image on hover, and when it is worth having

First, your theme

Plenty of commercial themes have an image swap option in their shop settings. If yours does and you are happy with a simple fade or flip, use it. It is one less plugin, and the guide has the code for doing it by hand as well.

What this plugin adds

The change goes through a transition instead of a cut, and it rests on the second image until the pointer leaves. There is no timed cycling. With the Pro scrub setting, moving the pointer across the picture goes through the rest of the gallery. Colour swatches on the card preview a variation on hover and pick it on a click. Details can come in over the image. The same morph can be switched on for all product lists in the shop, and off again.

The second image decides

A second image only helps if it shows something new. On clothing it could be the back or a model wearing it; on furniture, the same piece in a room; on a watch, the case from the side. A close-up of the same angle tells a shopper little, and an image that is different in crop makes the swap look jumpy. Keep the product at the same size and in the same place across a gallery where possible, because the morph looks best that way.

Square photos

Shop lists look calm when every image has the same shape. Square is the usual choice, and it is the safest for mixed products. Whichever you choose, check WooCommerce's catalog image crop in the Customizer so that the second image does not get a different crop from the first.

What it does not do

It cannot make up an image. A product with a single photo stays still. And there is no separate field for a hover image: it uses the gallery order, so changing the second image means dragging another image into second place in the product's gallery.

Questions