WooCommerce 产品图片尺寸设置：GIF 不动与原图调用

WooCommerce 产品图片尺寸会同时受到 WordPress 中间尺寸、主题设置和浏览器 srcset 选择的影响。如果产品主图是 GIF，详情页调用了静态缩略图，就可能出现动画不播放；如果比例设置不一致，也容易出现模糊或裁剪。

WooCommerce 为什么不总是显示原图

上传图片后，WordPress 会按已注册的尺寸生成多个中间版本。WooCommerce 和主题通常请求适合产品列表、单品页或缩略图的位置尺寸，再由响应式图片属性帮助浏览器选择文件。这样可以减少不必要的下载流量，但也意味着前端看到的不一定是上传时的原始文件。

上图中的 woocommerce_single 通常对应单个产品页面使用的图片尺寸。最终输出仍可能被当前主题、WooCommerce 模板覆盖或图片优化插件改变，因此要以浏览器实际加载的图片 URL 为准。

WordPress 会生成哪些图片版本

媒体文件上传后，WordPress 会依据“设置 → 媒体”、主题和插件注册的尺寸生成多个文件。等比例缩放不会把小图强行放大；是否裁剪则取决于该尺寸是否启用了硬裁剪，而不是所有缩略图都会自动裁剪。

同一张图片在页面上可能通过 src 指向一个默认尺寸，并在 srcset 中列出其他候选尺寸。浏览器会综合容器宽度、设备像素比和 sizes 属性决定下载哪个文件，所以只看编辑器中的下拉选项还不够。

GIF 在产品页不动怎么处理

1. 打开产品详情页，用浏览器开发者工具检查主图实际加载的文件名。如果 URL 带有类似 -300x300 的尺寸后缀，说明页面正在使用中间尺寸。
2. 在主题提供的 WooCommerce 产品图片设置中，把单品图片宽度调整到接近实际展示尺寸。部分经典主题入口为“外观 → 自定义 → WooCommerce → 产品图片”。区块主题或自定义模板的入口可能不同。
3. 清除 WordPress、缓存插件和 CDN 缓存；如果修改了已注册尺寸，旧图片可能需要安全地重新生成缩略图。
4. 再次检查前端 URL 和 GIF 动画。不要仅为了强制原图而让所有访问者下载数 MB 的文件，优先压缩 GIF，或在适合的场景改用 WebM/MP4。

产品图片尺寸的实用建议

• 同一产品的主图尽量使用统一长宽比，减少列表页跳动和不可控裁剪。
• 上传尺寸至少覆盖桌面端最大实际显示宽度，同时避免远超使用场景的超大文件。
• 商品细节图优先使用清晰的 WebP/JPEG；需要透明背景时使用 WebP/PNG；动画内容优先评估视频格式。
• 更换主题或修改尺寸后，先在少量图片上测试，再批量重建缩略图。

关于 2560px 大图缩放

WordPress 默认会对超过大图阈值的上传图片生成带 -scaled 的版本，并把它作为前端常用的完整尺寸来源；原始文件通常仍保存在上传目录中。这个机制有助于控制超大照片的前端体积，但如果你的工作流必须使用原始像素，需要同时检查 WordPress 的大图阈值、主题模板和图片优化插件。

总结

解决 WooCommerce 产品图片尺寸或 GIF 不播放的问题，关键不是一律强制原图，而是确认页面实际请求的尺寸、主题模板如何输出图片以及缓存是否已更新。在画质、动画和加载速度之间找到合适的文件尺寸，通常比关闭所有响应式图片机制更稳妥。