VPS主机与服务器★ 4.5 推荐评级

修改WooCommerce产品图册的图片数量

博主头像站长评测
发布于 2022/05/12原创独立站体系

默认情况下WordPress使用WooCommerce传产品,产品相册是展示4张图,如果想要在一排展示更多数量的产品图片,可以在主题函数文件里面添加下面的代码实现。

// 调整产品图册单排展示数量 add_filter( ‘woocommerce_product_thumbnails_columns’, create_function( ‘’, ‘return 4;’ ) );

把上面代码中的4改成你想要展示的图片数量就行了。

修改完毕之后可能不同的主题还需要修改一下css样式,这个就没有公用的代码了,需要根据自己网站实际情况调整。

WooCommerce 产品图册(Product Gallery)排版逻辑

在商品详情页中,WooCommerce 默认通常以 3 列或 4 列展示主图下方的缩略图图册。如果上传的辅图较多或者页面布局为宽屏模式,自定义图册列数能让详情页看起来更加精致紧凑。

代码级实现方法

无需安装冗杂的第三方扩展,在当前激活主题(或子主题)的 functions.php 文件中追加以下过滤器代码即可实现灵活定制:

// 自定义商品详情页产品相册每行缩略图展示列数
add_filter( 'woocommerce_product_thumbnails_columns', 'custom_woocommerce_gallery_columns' );
function custom_woocommerce_gallery_columns() {
    // 将此处数字修改为你期望的列数(例如 5 列或 6 列)
    return 5;
}

保存后清空站点前端页面缓存,前台商品详情页下方图册即会按照指定的列数自适应排列展示。