求助：WooCommerce网站产品SKU排序异常问题

这是字符串字典序排序的典型问题——系统默认把SKU当作纯文本逐个字符比较，导致数字部分按字符顺序而非数值顺序排列。比如ER10之后会优先出现ER101、ER102，因为文本中"ER10"的第四个字符是"0"，比"ER11"的第四个字符"1"小，所以"ER101"会排在"ER11"前面。

以下是针对不同场景的代码解决方案，避免插件冲突问题：

1. WordPress WooCommerce 专属方案 #

如果用WooCommerce管理产品，直接在主题functions.php或自定义插件中添加代码：

方法1：全局产品列表排序修正 #

add_filter('posts_orderby', 'custom_sku_natural_sort', 10, 2);
function custom_sku_natural_sort($orderby, $query) {
    global $wpdb;
    // 仅在前台产品列表页生效
    if (!is_admin() && $query->is_main_query() && (is_shop() || is_product_category() || is_product_tag())) {
        // 提取SKU中的数字转成数值排序，同时保留前缀分组
        $orderby = "CAST(REGEXP_REPLACE({$wpdb->posts}.post_name, '[^0-9]', '') AS UNSIGNED) ASC, {$wpdb->posts}.post_name ASC";
    }
    return $orderby;
}

方法2：精准针对SKU排序选项 #

如果是用户选择按SKU排序时生效：

add_filter('woocommerce_get_catalog_ordering_args', 'custom_sku_ordering_args');
function custom_sku_ordering_args($args) {
    if (isset($_GET['orderby']) && $_GET['orderby'] === 'sku') {
        $args['orderby'] = 'meta_value';
        $args['meta_key'] = '_sku';
        // 追加数字排序规则
        add_filter('posts_orderby', function($orderby) use ($wpdb) {
            return "CAST(REGEXP_REPLACE({$wpdb->postmeta}.meta_value, '[^0-9]', '') AS UNSIGNED) ASC, {$wpdb->postmeta}.meta_value ASC";
        }, 10);
    }
    return $args;
}

说明：正则REGEXP_REPLACE会过滤掉SKU中所有非数字字符，将剩余部分转为整数排序，同时保留前缀的分组顺序（比如ER开头的产品会整体排在P开头产品之前）。

2. 通用前端JS排序方案 #

如果需要在前端页面手动修正排序，可使用这段代码：

// 替换为你的产品容器和SKU选择器
const productContainer = document.querySelector('.products-container');
const productItems = Array.from(productContainer.querySelectorAll('.product-item'));

// 按SKU前缀+数字数值排序
productItems.sort((a, b) => {
    const skuA = a.querySelector('.product-sku').textContent.trim();
    const skuB = b.querySelector('.product-sku').textContent.trim();
    
    // 提取前缀和数字部分
    const prefixA = skuA.replace(/[0-9]/g, '');
    const prefixB = skuB.replace(/[0-9]/g, '');
    const numA = parseInt(skuA.replace(/[^0-9]/g, ''), 10) || 0;
    const numB = parseInt(skuB.replace(/[^0-9]/g, ''), 10) || 0;
    
    // 先比前缀，再比数字
    if (prefixA !== prefixB) {
        return prefixA.localeCompare(prefixB);
    }
    return numA - numB;
});

// 重新渲染排序后的列表
productContainer.innerHTML = '';
productItems.forEach(item => productContainer.appendChild(item));

注意事项 #

• 所有代码先在测试环境验证，确认无冲突后再部署到线上
• 不同CMS的核心逻辑一致：提取SKU中的数字部分，按数值类型排序，而非字符串排序

内容的提问来源于stack exchange，提问作者Kevin Huynh