在 woocommerce 3 中调整产品图片的缩放比例

Question

我正在使用 Storefront 主题，我想知道是否有一种方法可以调整将鼠标悬停在产品图片上时对其施加的缩放级别。

Answer 1

这可以使用 woocommerce_single_product_zoom_options 专用过滤器挂钩。

The hook undocumented available parameters in the options array are:

$zoom_options = array (

    'url' => false,
    'callback' => false,
    'target' => false,
    'duration' => 120, // Transition in milli seconds (default is 120)
    'on' => 'mouseover', // other options: grab, click, toggle (default is mouseover)
    'touch' => true, // enables a touch fallback
    'onZoomIn' => false,
    'onZoomOut' => false,
    'magnify' => 1, // Zoom magnification: (default is 1  |  float number between 0 and 1)
);

相关：Available parameters details for WooCommerce product image zoom options

使用 woocommerce_single_product_zoom_options 过滤器挂钩 更改放大级别 （例如，我们将缩放级别最小化一点）:

add_filter( 'woocommerce_single_product_zoom_options', 'custom_single_product_zoom_options' );
function custom_single_product_zoom_options( $zoom_options ) {
    // Changing the magnification level:
    $zoom_options['magnify'] = 0.7;

    return $zoom_options;
}

代码进入您的活动子主题（或活动主题）的 functions.php 文件。测试和工作。

之前使用默认放大倍数（设置为1）:

放大设置为0.7之前：

在 woocommerce 3 中调整产品图片的缩放比例

Adjusting product image's Zoom magnification factor in woocommerce 3

php

wordpress

image

zooming

woocommerce