# 商品列表頁配置
*****
## 1，產品屬性過濾 (Product Filtering)， Layered Nav widget
實現方法：管理后臺自定義設計 **Appearance > Customize > widget > sidebar**
選擇對應 filter 則可以：
*****
*****
## 2，列表 促銷/優惠圖標 (Promotion Icon)
列表模板已經有這功能，只需要自定義樣式則可以。
### 3，更多自定義樣式，可參考：
[WooCommerce Smart Sale Badge – WordPress plugin | WordPress.org](https://wordpress.org/plugins/woocommerce-smart-sale-badge/)
[Sales Countdown Timer – WordPress plugin | WordPress.org](https://wordpress.org/plugins/sales-countdown-timer/)
## 4，改變列表頁數
```
add_filter( 'loop_shop_columns',
'woocommerce_cookbook_loop_shop_columns', 20 );
function woocommerce_cookbook_loop_shop_columns( $cols ) {
return 3;
}
```
*****
*****
*****
## 5，自定義排序
```
// Add a new sorting option
add_filter( 'woocommerce_default_catalog_orderby_options','woocommerce_cookbook_catalog_orderby' );
add_filter( 'woocommerce_catalog_orderby','woocommerce_cookbook_catalog_orderby' );
function woocommerce_cookbook_catalog_orderby( $sortby ) {
$sortby['oldest_to_newest'] = __( 'Sort by oldest to newest', 'woocommerce' );
return $sortby;
}
// Add sorting oldest to newest functionality to sorting dropdown
add_filter( 'woocommerce_get_catalog_ordering_args','woocommerce_cookbook_get_catalog_ordering_args' );
function woocommerce_cookbook_get_catalog_ordering_args($args ) {
// get the orderby value
$orderby_value = isset( $_GET['orderby'] ) ? wc_clean($_GET['orderby'] ) :
apply_filters(
'woocommerce_default_catalog_orderby', get_option(
'woocommerce_default_catalog_orderby' ) );
// if the orderby value matches our custom option
if ( 'oldest_to_newest' == $orderby_value ) {
$args['orderby'] = 'date';
$args['order'] = 'ASC';
}
return $args;
}
```
## 6，展示品類圖片
```
function woocommerce_cookbook_category_image() {
if ( is_product_category() ){
global $wp_query;
$cat = $wp_query->get_queried_object();
$thumbnail_id = intval( get_woocommerce_term_meta(
$cat->term_id, 'thumbnail_id', true ) );
$image = wp_get_attachment_url( $thumbnail_id );
if ( $image ) {
echo '<img src="' . esc_url( $image ) . '"
alt="" />';
}
}
add_action( 'woocommerce_archive_description',
'woocommerce_cookbook_category_image', 2 );
```
## 7，列表內容過濾、自定義列表內容
例子：怎樣去掉特定分類
```
//Removing a product category from the Shop page
add_action( 'pre_get_posts',
'woocommerce_cookbook_pre_get_posts_query' );
function woocommerce_cookbook_pre_get_posts_query( $q ) {
if ( ! $q->is_main_query() ) return;
if ( ! $q->is_post_type_archive() ) return;
if ( ! is_admin() && is_shop() ) {
$q->set( 'tax_query', array(array(
'taxonomy' => 'product_cat',
'field' => 'slug',
'terms' => array( 'posters' ),
'operator' => 'NOT IN'
)));
}
remove_action( 'pre_get_posts',
'woocommerce_cookbook_pre_get_posts_query' );
}
```
## 8，產品雙圖片/多圖片展示 (Multiple images on PLP)
TODO
