我认为你会想要做的，假设你的安装是一个有点标准的WooC安装，是利用循环项目的行动挂钩添加所需的悬停图像。

add_action( 'woocommerce_before_shop_loop_item_title', 'add_on_hover_shop_loop_image' ) ; 

function add_on_hover_shop_loop_image() {

    $image_id = wc_get_product()->get_gallery_image_ids()[1] ; 

    if ( $image_id ) {

        echo wp_get_attachment_image( $image_id ) ;

    } else {  //assuming not all products have galleries set

        echo wp_get_attachment_image( wc_get_product()->get_image_id() ) ; 

    }

}

初步CSS：

/* CUSTOM ON-HOVER IMAGE */
.woocommerce ul.products li.product a img { 
    /* FORMAT ALL IMAGES TO FILL EQUIVALENT SPACE,
    to remove jitter on replacement */
    height: 150px;
    width: 150px;
    object-fit: cover;
    padding: 0;
    margin: 0 auto;
}
.woocommerce ul.products li.product a img:nth-of-type(2) {
    display: none;
}
.woocommerce ul.products li.product a:hover img:nth-of-type(2) {
    display: block
}
.woocommerce ul.products li.product a:hover img:nth-of-type(1) {
    display: none;
}

以上将得到你想要的一种类型的商店档案显示，实现一个简单的替换，但将有许多细节，你可能需要或想为您的网站自定义。150x150px可能不适合您的主题大小，例如。或者你可能决定你需要用一个不同的设置完全替换默认图像，并获得一个特定的过渡效果，或者为了与站点上使用的其他效果保持一致，您需要使用不同的CSS方法，可能还需要使用不同的javascript方法。

如果您没有删除WooCommerce的默认操作和过滤器，您可以使用该插件。
下面是link插件

CSS可以检测用户何时悬停在图像上。你有没有可能加载两个图像，然后在检测到悬停时只关闭一个打开一个？
代码如下所示：
超文本：

<a id="home">
<img class="image_on" src="images/productImage.png"" />
<img class="image_off" src="images/galleryImage.png" />
</a>

CSS：

.image_off, #home:hover .image_on{
     display:none
}
.image_on, #home:hover .image_off{
     display:block
}

如果这不起作用，请使用js/jquery检查this thread以获取其他解决方案

这是你要找的吗？
WooCommerce Product Image Flipper
看起来它还没有经过最新的3个主要WordPress版本的测试，你仍然可以尝试一下。
这个thread似乎也解释了你需要什么。

使用此代码工作完美|Woocomerce最新版本在WooCommerce存档页面上切换悬停的产品图像

add_action( 'woocommerce_before_shop_loop_item_title', 'add_on_hover_shop_loop_image' ) ; 

function add_on_hover_shop_loop_image() {

    $image_id = wc_get_product()->get_gallery_image_ids()[0] ; 

    if ( $image_id ) {

        echo wp_get_attachment_image( $image_id ) ;

    } else {  //assuming not all products have galleries set

        echo wp_get_attachment_image( wc_get_product()->get_image_id() ) ; 

    }

}

使用这个你会得到产品的全尺寸图像

add_action( 'woocommerce_before_shop_loop_item_title', 'add_on_hover_shop_loop_image' ) ; 

function add_on_hover_shop_loop_image() {

$image_id = wc_get_product()->get_gallery_image_ids()[1] ; 
$img_size = wc_get_image_size( $image_id, 'full' );

if ( $image_id ) {

    echo wp_get_attachment_image( $image_id, 'full' ) ;

} else {  //assuming not all products have galleries set

    echo wp_get_attachment_image( wc_get_product()->get_image_id() ) ; 

}

}

如果要在product-content.php上使用此选项，请使用全局product而不是wc_get_product

global $product;
$attachment_ids = $product->get_gallery_image_ids();

然后：

foreach( $attachment_ids as $attachment_id ) {
     wp_get_attachment_image( $attachment_id )
}