如何更改 WooCommerce 缩略图裁剪位置？答案

【问题标题】：How to change WooCommerce thumbnail crop position?如何更改 WooCommerce 缩略图裁剪位置？
【发布时间】：2016-11-09 06:18:53
【问题描述】：

我正在尝试更改 WooCommerce 缩略图裁剪位置。我发现这段代码可以帮助改变大小：

add_action( 'init', 'yourtheme_woocommerce_image_dimensions', 1 );

/**
 * Define image sizes
 */
function yourtheme_woocommerce_image_dimensions() {
    $catalog = array(
        'width'     => '100',   // px
        'height'    => '100',   // px
        'crop'      => 0
    );

    // Image sizes
    update_option( 'shop_catalog_image_size', $catalog );       // Product category thumbs
}

我做了一些尝试，例如将裁剪 0 更改为 array("center", "bottom")，但它不起作用：

function yourtheme_woocommerce_image_dimensions() {
    $catalog = array(
    'width'   => '300', // px
    'height'  => '400', // px
    'crop'    => 'array("center", "bottom")'
  );

  // Image sizes
  update_option( 'shop_catalog_image_size', $catalog );     // Product category thumbs
}

这也没有成功：

if (function_exists( 'add_image_size' )){
  add_image_size( 'shop_catalog', 300, 400, array( 'center', 'bottom' ) );
}

无论如何我可以改变它吗？

谢谢。

【问题讨论】：

标签： php wordpress woocommerce crop image-size

【解决方案1】：

要更改活动子主题或主题中的现有图像大小（裁剪选项），您需要使用'after_switch_theme' WordPress 挂钩。

自 WordPress 3.9+ 以来，这是一个很棒的新功能，现在增加了控制上传到 WordPress 中的图像的裁剪位置的能力。
我不知道 woocommerce 图像大小是否可以使用作物药水高级选项，您必须对其进行测试。

裁剪位置的可用选项有：

left top
left center
left bottom
right top
right center
right bottom
center top
center center
center bottom

所以基于来自 wooThemes 的 this snippet 和 WordPress 的（这个相对较新的）裁剪选项，你可以试试这个：

function yourtheme_woocommerce_image_dimensions() {
    global $pagenow;

    if ( ! isset( $_GET['activated'] ) || $pagenow != 'themes.php' ) {
        return;
    }
    $catalog = array(
        'width'     => '300',   // px
        'height'    => '400',   // px
        'crop'      => array( 'center', 'bottom' ) // New crop options to try.
    );
    /* $single = array(
        'width'     => '600',   // px
        'height'    => '600',   // px
        'crop'      => 1        // true
    );
    $thumbnail = array(
        'width'     => '120',   // px
        'height'    => '120',   // px
        'crop'      => 0        // false
    ); */
    // Image sizes
    update_option( 'shop_catalog_image_size', $catalog );       // Product category thumbs
    /* update_option( 'shop_single_image_size', $single );      // Single product image
    update_option( 'shop_thumbnail_image_size', $thumbnail );   // Image gallery thumbs */
}
add_action( 'after_switch_theme', 'yourtheme_woocommerce_image_dimensions', 1 );

您需要将此代码 sn-p 粘贴到您的活动子主题或主题的 function.php 文件中……

您可以注释/取消注释代码（或删除某些部分）以满足您的需求。此代码将覆盖 WooCommerce 设置 > 产品 > 显示（产品图像）中的定义选项。

激活：
您需要将您的活动主题切换到另一个主题，然后再切换回来以激活它。

参考资料：

Set WooCommerce image dimensions upon theme activation

【讨论】：