WordPress+Elementor搭建WooCommerce：创建自动展示缺货商品的已售页面遇阻

问题根源 #

你错误使用了短码：你自定义的短码是[out_of_stock_products]，但你给原生WooCommerce的[products]短码添加了不存在的out_of_stock_products参数，这导致短码无法识别你的需求，自然不会显示缺货商品。

修正方案 #

1. 替换自定义代码（可选优化） #

原代码只能返回所有缺货商品，我们可以修改代码，让它支持limit和columns参数，更适配你的需求：

/**
 * 短码：展示缺货商品，支持limit和columns参数
 */
add_shortcode( 'out_of_stock_products', 'bbloomer_out_of_stock_products_shortcode' );
   
function bbloomer_out_of_stock_products_shortcode( $atts ) {
    // 提取短码参数，设置默认值
    $atts = shortcode_atts( array(
        'limit'   => -1,
        'columns' => 3,
    ), $atts );
 
    $args = array(
        'post_type'      => 'product',
        'posts_per_page' => $atts['limit'],
        'post_status'    => 'publish',
        'meta_query'     => array(
            array(
                'key'     => '_stock_status',
                'value'   => 'outofstock',
            )
        ),
        'fields'         => 'ids',
    );
    
    $product_ids = get_posts( $args ); 
    $product_ids = implode( ",", $product_ids );
    
    // 传入参数到原生products短码
    return do_shortcode("[products ids='$product_ids' columns='{$atts['columns']}']");
}

2. 使用正确的短码 #

在Elementor容器中添加短码小工具，输入：

[out_of_stock_products limit="6" columns="3"]

额外排查点 #

• 确认目标商品的库存状态确实是缺货（Out of Stock）：进入商品编辑页，检查“库存”选项卡中的状态设置。
• 代码添加位置：建议使用Code Snippets插件添加自定义代码，避免直接修改主题functions.php（主题更新会丢失代码）。
• 清理缓存：更新代码后，清理WordPress缓存、浏览器缓存，再刷新页面查看效果。

内容的提问来源于stack exchange，提问作者KJ's Closet