如何在WooCommerce 9.0.2购物车项短内容前添加自定义内容

WooCommerce Blocks（区块版购物车/结账）采用了和传统短码版不同的渲染架构，你之前尝试的woocommerce_get_price_html等钩子只对旧版短码页面生效，针对区块页面需要使用专门的Blocks过滤器。下面提供两种可行的实现方式：

方法1：直接修改商品项HTML（快速生效） #

通过woocommerce_blocks_cart_item_html和woocommerce_blocks_order_summary_item_html过滤器，直接插入ACF字段内容到商品描述区域前：

// 同时适配购物车区块和结账页订单摘要区块
add_filter( 'woocommerce_blocks_cart_item_html', 'insert_acf_before_cart_item_description', 10, 3 );
add_filter( 'woocommerce_blocks_order_summary_item_html', 'insert_acf_before_cart_item_description', 10, 3 );

function insert_acf_before_cart_item_description( $item_html, $cart_item, $item_key ) {
    // 替换为你的ACF字段名称
    $acf_field_content = get_field( 'your_acf_field_slug', $cart_item['product_id'] );
    
    if ( ! empty( $acf_field_content ) ) {
        // 构造要插入的ACF内容HTML
        $acf_html = '<div class="cart-item-acf-content" style="margin-bottom: 8px; color: #666;">' . wp_kses_post( $acf_field_content ) . '</div>';
        
        // 匹配区块中商品描述的容器，插入ACF内容
        // 若区块HTML结构有变化，可通过浏览器元素检查调整正则匹配规则
        $item_html = preg_replace( '/(<div class="wc-block-cart-item__description">)/', '$1' . $acf_html, $item_html );
    }
    
    return $item_html;
}

注意事项： #

• 替换your_acf_field_slug为你实际的ACF字段别名
• wp_kses_post用于过滤不安全的HTML，确保站点安全
• 如果正则匹配失败，打开浏览器开发者工具查看购物车项的HTML结构，调整匹配的class或标签

方法2：操作区块内部结构（更符合区块架构） #

这种方式直接修改WooCommerce Blocks的内部区块树，避免正则匹配的局限性：

// 适配购物车和结账页的商品项区块
add_filter( 'woocommerce_blocks_cart_item_inner_blocks', 'add_acf_block_before_description', 10, 3 );
add_filter( 'woocommerce_blocks_order_summary_item_inner_blocks', 'add_acf_block_before_description', 10, 3 );

function add_acf_block_before_description( $inner_blocks, $cart_item, $item_key ) {
    $acf_field_content = get_field( 'your_acf_field_slug', $cart_item['product_id'] );
    
    if ( ! empty( $acf_field_content ) ) {
        // 创建一个新的段落区块承载ACF内容
        $acf_block = [
            'blockName' => 'core/paragraph',
            'attrs' => [
                'className' => 'cart-item-acf-content',
                'content' => $acf_field_content,
            ],
            'innerBlocks' => [],
        ];
        
        // 找到产品描述区块的位置，插入ACF区块
        foreach ( $inner_blocks as $index => $block ) {
            if ( $block['blockName'] === 'woocommerce/product-description' ) {
                array_splice( $inner_blocks, $index, 0, [ $acf_block ] );
                break;
            }
        }
    }
    
    return $inner_blocks;
}

注意事项： #

• 同样需要替换your_acf_field_slug为实际字段名
• 若区块结构更新，可通过var_dump($inner_blocks)查看区块数组的结构，调整查找逻辑

使用说明 #

将上述任意一段代码添加到你的WordPress主题functions.php文件中，或者自定义功能插件里，不要直接修改WooCommerce核心文件。

内容的提问来源于stack exchange，提问作者Vatsal Patel