在 WooCommerce 中禁用原始图像裁剪

Question

然后是所有产品的肖像图，根据我的主题设计，我必须将所有图像显示在一个正方形中box.So所有图像都被裁剪并显示。

如何在 woocommerce 中禁用原始图像裁剪？

因为我在裁剪 WooCommerce 过程中遇到问题：

原图

Woocommerce 裁剪图片如：

那么我该如何解决这个问题，就像原始图像一样，停止裁剪由 WooCommerce 调整大小的缩略图？

Answer 1

转到 woocommerce > 设置 > 产品 （选项卡） > 显示 (sub-tab)

然后在页面底部的“产品图片”中，禁用硬裁剪选项并保存更改:

然后您需要使用 Regenerate Thumbnails 插件重新生成您的产品图片:

安装并激活 Regenerate Thumbnails 插件.
进入“工具”菜单，您会找到一个 "Regenerate thumbnails" 项目页面。
按重新生成所有缩略图（这将重新生成您的 WordPress 网站的所有缩略图图像。
在 WordPress 媒体库（列表视图）中，您可以一张一张地重新生成缩略图。

与 PHP 替代:

有时在某些主题中，这是硬编码的设置。因此，您可以使用此代码片段更改它们，将其粘贴到活动子主题或主题的 function.php 文件中：

function yourtheme_woocommerce_image_dimensions() {
    global $pagenow;

    if ( ! isset( $_GET['activated'] ) || $pagenow != 'themes.php' ) {
        return;
    }
    $catalog = array(
        'width'     => '300',   // px
        'height'    => '300',   // px
        'crop'      => 0 // Disabling Hard crop option.
    );
    $single = array(
        'width'     => '150',   // px
        'height'    => '150',   // px
        'crop'      => 0 // Disabling Hard crop option.
    );
    $thumbnail = array(
        'width'     => '90',   // px
        'height'    => '90',   // px
        'crop'      => 0 // Disabling Hard crop option.
    );
    // 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 );

您可以 comment/uncomment 代码（或删除一些部分）来满足您的需要。此代码将覆盖 WooCommerce 设置 > 产品 > 显示（产品图片）中的定义选项。

ACTIVATION: You will need to switch your active theme to another and then switch back to activate it.

您可能还需要使用 Regenerate Thumbnails 插件重新生成产品图片...

Answer 2

由于 WooCommerce 菜单在上一个版本中有所更改，因此此 "Display" 菜单不再存在。

现在您可以在以下位置找到它：

-> 自定义（位于前面的 Wordpress 顶部栏中）

-> WooCommerce

-> 产品图片

-> Select "Uncropped" 选项，然后点击 "Publish" 保存。

不要忘记使用此插件重新生成缩略图，就像之前 post 中提到的那样：https://wordpress.org/plugins/regenerate-thumbnails/

Answer 3

如果要通过代码设置，请将此代码段添加到 functions.php 文件中：

// set thumbnails size in shop page
add_filter( 'woocommerce_get_image_size_thumbnail', 'ci_theme_override_woocommerce_image_size_thumbnail' );
function ci_theme_override_woocommerce_image_size_thumbnail( $size ) {
    // Catalog images: specific size
    return array(
        'width'  => 150,
        'height' => 150,
        'crop'   => 0, // not cropped
    );
}

作为 Silver Moon mentioned, in case you use this option, it will force you to make share that all the images are of equal size. I found a workaround to deal with this issue: I'm using Woo Align Buttons 插件对齐 'add to cart' 按钮并将这些 CSS 属性添加到商店页面中的图像：

height: 150px;
vertical-align: middle;
display: flex;

如果您想在其他页面（而不是商店页面）上使用它，请按照以下指南操作：https://docs.woocommerce.com/document/image-sizes-theme-developers/

在 WooCommerce 中禁用原始图像裁剪

Disable original image crop in WooCommerce

php

wordpress

product

image

woocommerce