WooCommerce setup_theme product_grid default_columns not working

WooCommerce 主題開發時會用下面代碼安裝 WooCommerce 於主題中,而在 add_theme_support('woocommerce',$args) 第二個參數則是傳遞給 WooCommerce 的相關初始參數

<?php

add_theme_support( 'woocommerce', array(
	'single_image_width'    => 600,
	'thumbnail_image_width' => 300,
	'product_grid' => array(
		'default_columns' => 3,
		'min_columns'     => 2,
		'max_columns'     => 5,
		'default_rows' => 3,
		'min_rows'     => 2,
		'max_rows'     => 8,
	),
) );
woocommerce setup_theme product_grid default_columns not working
預設產品列表 4 欄

問題是這樣的,開發過程中,試圖修改商品列表欄數,修改上方代碼 default_rows 由4改為3,刷新後,產品列表卻還是4欄,後來找到原因是 add_theme_support('woocommerce',$args) 相關參數,只有在啟動主題時生效儲存,所以動態去修改它是不會被套用的。

解決方法

1.切換至其他主題

在切換回正在開發的主題,這些參數就會被更新

2.透過 filter 來改

/**
 * 修改每頁顯示筆數
 * @link https://v123.tw
 */
function v123_product_total_per_page( $products ) {
 $products = 12;
 return $products;
}
add_filter( 'loop_shop_per_page', 'v123_product_total_per_page', 30 );


/**
 * 修改列表欄數量
 * @link https://v123.tw
 */
function v123_product_page_columns( $columns ) {
  $columns = 3;
  return $columns;
}
add_filter( 'loop_shop_columns', 'v123_product_page_columns' );
woocommerce setup_theme product_grid default_columns not working
預設產品列表 3 欄

參考文章:
https://github.com/woocommerce/woocommerce/issues/25332

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料