如何使用 WooCommerce 更改每行的产品类别数

Posted 2023-02-19

【中文标题】如何使用 WooCommerce 更改每行的产品类别数

【英文标题】：How to change the number of product categories per row using WooCommerce

【发布时间】：2016-12-20 07:14:47

【问题描述】：

我正在使用 Woocommerce 设置在初始商店页面上显示类别缩略图，然后在其中显示产品及其缩略图。

我希望初始类别页面每行显示 3 个缩略图，产品页面每行显示 5 个类别。

每行显示我使用过的 5 个产品：

add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) 
    function loop_columns() 
    return 5;
    

这也会更改类别页面和商店页面上每行的缩略图。

有谁知道如何将类别页面更改为每行 3 个缩略图并在商店页面上每行保持 5 个产品？

【参考方案1】：

使用WooCommerce conditionals tags，将帮助您实现这一目标。我已经更改了您的代码：

add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) 
    function loop_columns() 
        if ( is_product_category() ) 
            return 3;
         else  // for other archive pages and shop page
            return 5;
        
    

此代码位于您的活动子主题或主题的 function.php 文件中

建议：有时，有必要更改一些 css 规则，以获得正确的每行显示。

WooCommerce 条件标签用法：

要定位商店页面存档：

if ( is_shop() ) 
    // return the number of items by row

要定位产品标签档案：

if ( is_product_tag() ) 
    // return the number of items by row

定位所有产品档案，除了产品类别档案（添加 ! 在开始）：

if ( !is_product_category() ) 
    // return the number of items by row

您还可以定义一些特定的类别或标签 （请参阅相关文档）。

---

参考资料：

WooCommerce - Change number of products per row WooCommerce - Conditionals tags

【讨论】：

改进建议：仅使用 if ( is_product_category() ) return 3; 其他 返回 5; 。这样您就不会两次使用相同的变量 (3)

【参考方案2】：

在我的店面子主题中。接受的答案对我不起作用。我不得不将 woocommerce/templates/loop/loop-star.php 复制到我的子主题子文件夹 /woocommerce/loop/ 并像这样修改它：

if ( ! defined( 'ABSPATH' ) ) 
    exit;


// FMP20181126 - Categories are SubCategories set # of columns.
$display_type = woocommerce_get_loop_display_mode();
if ( 'subcategories' === $display_type || 'both' === $display_type ) 
        wc_set_loop_prop( 'columns', 3 );
   

?>

<ul class="products columns-<?php echo esc_attr( wc_get_loop_prop( 'columns' ) ); ?>">