如何设置 WooCommerce 店面缩略图大小

已发表: 2020-09-26

设置 WooCommerce 店面缩略图大小 如果您正在经营一家 WooCommerce 商店，那么您就会知道图像是您在线商店中最重要的部分之一。 然而，WooCommerce 使用了许多不同的产品图像尺寸类型。 这使得很难弄清楚您可以在哪里更改它们以满足您的特定需求。

设置 WooCommerce 店面缩略图大小

这意味着 WooCommerce 图像定制可能会变得有点复杂。 这就是为什么我整理了本指南来介绍 WooCommerce 图像的各个方面，因此您可以跳到适合您的部分。 此外，我将使用 Storefront 主题。

设置产品图片尺寸有什么好处？

在我们进入“如何”之前，您可能想知道为什么？ 以下是一些好处：

  • 它可以防止图像模糊。 尺寸错误的图像可能会显得模糊，这会给您的买家留下不好的第一印象。
  • 它优化了速度。 当图像很大时，加载时间会更长。 这会减慢您的网站速度，从而导致收入减少和用户不满意。

调整产品缩略图大小的步骤

默认情况下，WooCommerce 允许您调整产品图像的大小。 您需要做的就是按照以下简单步骤操作：

  1. 登录您的 WordPress 站点并以管理员用户身份访问仪表板。
  2. 从仪表板菜单中，单击外观菜单 > 自定义。
  3. 单击WooCommerce > 产品图片。 缩略图裁剪
  4. 在缩略图裁剪字段中，您可以设置图像的高度。
  5. 如果您对更改感到满意，请单击“发布”。

店铺产品图片高度终极指南

在缩略图字段中，您可以使用 3 个不同的选项来设置商店或目录图像的高度：

  • 1:1：如果您选择 1:1，您的图像将被裁剪为 360 像素宽度和 360 像素高度。 假设您在缩略图宽度字段中将图像宽度设置为 360 像素，这将起作用。
  • 自定义：在这里您可以选择图像的纵横比。 这些是一些流行的纵横比（1:1、5:4、4:3、3:2、16:9 和 3:1）。
  • 未裁剪：在此选项中，图像的高度将保持不变。 您商店中的图像将使用它们上传时的纵横比显示。

经常问的问题

  • 如果主题开发人员设置了图像大小，我该如何更改？

有一个简单的解决方案，通过从你的主题 functions.php 文件中删除或更改图像宽度设置。 在 Storefront 主题中，没有主图像或缩略图字段的设置。 这是因为它们是事先在 storefront/inc/class-storefront.php 中声明的

// 声明 WooCommerce 支持。

 add_theme_support（'woocommerce'，apply_filters（'storefront_woocommerce_args'，数组（

 'single_image_width' => 416,

 'thumbnail_image_width' => 324,

 'product_grid' => 数组（

 'default_columns' => 3,

 'default_rows' => 4,

 'min_columns' => 1,

 'max_columns' => 6,

 'min_rows' => 1

 )

) ) );

单品图片尺寸设置为 416px 宽，缩略图设置为 324px 宽。 这意味着您可以删除这两行或将宽度编号更改为所需的宽度。 但是，您需要确保在创建子主题后进行更改。 这是因为如果您更新主题，它将恢复到以前的设置。

  • 如何设置目录图像大小？

对于商店产品图像和目录或类别图像，它们会根据外观 > 自定义 > WooCommerce > 产品图像 > 缩略图宽度字段中的设置调整大小。

  • 为什么我的 WooCommerce 产品图像模糊？

如果您的 WooCommerce 商店出现这种情况，您可以检查以下几点：

  1. 检查图像质量。 检查质量是否良好，如果添加到您的 WooCommerce 商店时质量低劣，它看起来不会像您想要的那样清晰。
  2. 缩略图设置。 检查设置，如果设置正在为您的产品页面寻找 500 像素的图像，在目录页面上寻找 160 像素的图像，但您只上传了 160 像素的图像，那么 WooCommerce 会自动放大您的图像，使其看起来模糊。
  • 最佳图像尺寸是多少？

在线商店的最佳图片尺寸取决于您用于商店的主题。 如果您销售的是衬衫等简单产品，则适合 800 – 1000 像素宽的图像尺寸。

但是，如果您有详细或复杂的图像，则上传更大的图像将允许潜在客户放大并近距离查看这些细节。 推荐大小为 2000px 宽，这样效果会更好

还值得一提的是，您永远不应该上传大图片。 过大的图片会减慢您的网站速度，因此可能会影响销售。

结论

在这个简短的教程中，您已经了解了如何只需单击几下即可设置 WooCommerce 店面缩略图大小。 此外，我还解释了如何更改产品和图库图像大小，以及缩略图设置的终极指南。

此外，您还了解了设置 WooCommerce 产品图像尺寸的好处。 过大的图像会减慢您的网站速度，因此可能会影响销售。 此外，我还添加了一个常见问题部分，其中包括您可能遇到的一些常见问题。

在您的在线商店进行销售时，图像非常重要。 确保您遵循本教程中提供的指南，如果您不确定所做的更改，请考虑使用 WooThumbs for WooCommerce 之类的插件。 它将允许您轻松更改 WooCommerce 产品图像大小并改善您的 WooCommerce 产品库。

类似文章

  1. 如何将侧边栏添加到店面 WooCommerce
  2. 如何创建 WooCommerce 店面子主题 [完整指南]
  3. 按角色注册后如何重定向用户
  4. 如何删除 WooCommerce 产品图像的缩放效果
  5. 如何调整页眉的 WooCommerce 店面高度
  6. 如何从 WooCommerce 主题的产品页面中删除侧边栏
  7. 如何在 WooCommerce 中自动批准订单
  8. 如何在 WooCommerce 中设置自定义相关产品
  9. 如何在 WooCommerce 中快速找到您的产品 ID
  10. 如何从前端添加 Woocommerce 产品
  11. 如何在店面设置后添加产品 [初学者指南]
  12. 如何隐藏 WooCommerce 中的缺货变化
  13. 如何在 WooCommerce 中隐藏添加到购物车按钮
  14. 如何从搜索结果中隐藏 WooCommerce 产品
  15. 如何修复未捕获的类型错误：wp.template 不是函数
  16. 如何逐步使用 WooCommerce 产品属性 [完整指南]
  17. 如何按类别显示 WooCommerce 产品