在网格中对齐产品图片和内容

产品卡片不齐通常是由于图片比例不一致、标题长度不同或产品卡片包含不同元素造成的。请分别配置这些区域，以保持产品网格对齐。

使用一致的图片比例

为了获得最一致的效果，请使用具有相同宽高比的产品图片。它们的精确像素尺寸不必匹配，但每个源图片都应足够大，以适应其显示的最大尺寸。

如果图片具有不同的宽高比，请配置 WooCommerce 将其目录缩略图裁剪为一致的形状。

配置 WooCommerce 缩略图裁剪

导航至 仪表盘 -> 外观 -> 自定义 -> WooCommerce -> 产品图片。

• 主图片宽度 — 控制单个产品页面上生成的图片宽度。主产品图片保持不裁剪。
• 缩略图宽度 — 控制目录和网格中产品生成的图片宽度。
• 缩略图裁剪：1:1 — 将目录缩略图裁剪为正方形。
• 缩略图裁剪：自定义 — 将缩略图裁剪为您指定的宽高比，例如 4:3 或 2:3。
• 缩略图裁剪：不裁剪 — 保留原始宽高比。因此，不同比例的图片在网格中可能具有不同的高度。

完成后发布自定义器更改。WooCommerce 会生成响应式图片尺寸，因此缩略图宽度不必与产品卡片的 CSS 宽度完全匹配。

限制产品标题长度

较长的产品标题可能会将价格、评分和按钮移动到不同的垂直位置。导航至 仪表盘 -> 主题设置 -> 产品存档 -> 产品循环 并配置 产品标题行数限制。当每个标题下方的内容应从同一级别开始时，请使用一致的一行或两行限制。

启用均匀产品网格

导航至 仪表盘 -> 主题设置 -> 产品存档 -> 产品网格，并为所需的桌面、平板和移动视图启用 均匀产品网格。这会使支持的产品卡片具有相等的行高，并将其操作内容在底部对齐。

均匀产品网格选项也可在 Gutenberg、Elementor 和 WPBakery 产品元素中使用。元素级设置允许您独立于产品存档配置特定网格。

均匀产品网格适用于支持的预定义产品设计。它不适用于列表视图或自定义产品循环项目布局。使用自定义布局时，请在布局本身中配置相等的高度和内容对齐方式。