You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

求助:调整WooCommerce添加购物车表单至商品描述下方

修正可变产品添加购物车表单位置的解决方案

我看你这段代码的问题主要出在两个地方:一是没针对可变产品的专属添加购物车动作做移除,二是优先级设置错了导致表单跑到描述上方。咱们来一步步修正:

首先,WooCommerce里可变产品的添加购物车按钮是用woocommerce_variable_add_to_cart这个函数挂载的,不是通用的woocommerce_template_single_add_to_cart,原代码可能误移除了错误的动作,导致效果不对。另外,钩子的优先级数字越小越先执行,要把表单放在商品描述下方,就得让它的优先级比描述的优先级更高(数值更大)。

情况1:移到商品短描述(产品摘要里的描述)下方

如果你的“商品描述”是指产品标题、价格下面的那段短描述,用这段代码:

// 调整可变产品添加购物车按钮位置到短描述下方
add_action( 'woocommerce_single_product_summary', 'move_variable_add_to_cart_below_short_description', 5 );
function move_variable_add_to_cart_below_short_description() {
    global $product;
    
    // 只对可变产品生效
    if ( ! $product->is_type( 'variable' ) ) {
        return;
    }
    
    // 移除默认的可变产品添加购物车动作(默认优先级30)
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_variable_add_to_cart', 30 );
    
    // 重新挂载到短描述之后:短描述的优先级是20,我们设25就会在它之后执行
    add_action( 'woocommerce_single_product_summary', 'woocommerce_variable_add_to_cart', 25 );
}

情况2:移到商品长描述(详情标签页)下方

如果是想把表单放到页面下方的详情标签页之后,用这段代码:

// 调整可变产品添加购物车按钮位置到长描述标签页下方
add_action( 'woocommerce_single_product_summary', 'move_variable_add_to_cart_below_long_description', 5 );
function move_variable_add_to_cart_below_long_description() {
    global $product;
    
    if ( ! $product->is_type( 'variable' ) ) {
        return;
    }
    
    // 移除默认的添加购物车动作
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_variable_add_to_cart', 30 );
    
    // 重新挂载到产品详情标签页之后:标签页的优先级是10,设20就会在它之后显示
    add_action( 'woocommerce_after_single_product_summary', 'woocommerce_variable_add_to_cart', 20 );
}

把代码放到你的主题functions.php文件里,或者用自定义代码插件添加就行,记得先备份原文件哦~

内容的提问来源于stack exchange,提问作者DrMTR

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.20 10:24:16