WordPress-woo产品图片展示相关配置

function xshen_woocommerce_setup() {
	add_theme_support(
		'woocommerce',
		array(
			'thumbnail_image_width' => 300,
			'single_image_width'    => 600,
			'product_grid'          => array(
				'default_rows'    => 3,
				'min_rows'        => 1,
				'default_columns' => 4,
				'min_columns'     => 1,
				'max_columns'     => 6,
			),
		)
	);
	add_theme_support( 'wc-product-gallery-zoom' );
	add_theme_support( 'wc-product-gallery-lightbox' );
	add_theme_support( 'wc-product-gallery-slider' );
}
add_action( 'after_setup_theme', 'xshen_woocommerce_setup' );

thumbnail_image_width

产品缩略图宽度(单位:像素),设置为 300px(如商品列表页的小图)。

single_image_width

单个产品页主图宽度,设置为 300px(如商品详情页的大图)。

product_grid

产品网格布局的默认规则:

default_rows:默认显示 3 行产品
min_rows / max_rows:最小 / 最大行数限制(此处最小 1 行)
default_columns:默认每行显示 4 个产品
min_columns / max_columns:最小 / 最大列数限制(此处 1-6 列可调)

启用产品画廊高级功能

add_theme_support( ‘wc-product-gallery-zoom’ );

鼠标悬停在产品图片上时,支持局部放大查看细节(类似电商网站的 “放大镜” 效果)。

add_theme_support( ‘wc-product-gallery-lightbox’ );

点击产品图片时,以全屏灯箱模式展示大图(避免跳转新页面,提升体验)。

add_theme_support( ‘wc-product-gallery-slider’ );

支持多图轮播切换(替代默认的静态多图排列,适合展示多角度商品)。