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

WooCommerce单产品页面:如何将产品价格移至标题上方(代码无效求助)

WooCommerce单产品页面价格移至标题上方的解决方法

你的代码无效是因为执行时机不对,或者主题/插件修改了默认钩子的优先级,导致remove_action没生效,反而新增了一个价格显示。试试下面几种解决办法:

方法一:延迟执行钩子操作

把移除和添加动作的代码放到wp_head钩子中,确保在主题加载完成后再执行,这样能覆盖主题的自定义设置:

add_action( 'wp_head', 'move_product_price_above_title' );
function move_product_price_above_title() {
    // 移除默认位置的价格,优先级必须和原动作一致(默认是10)
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );
    // 将价格添加到标题上方,产品标题的优先级是5,所以用3确保在标题之前显示
    add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 3 );
}

把这段代码添加到子主题的functions.php文件中,或者用代码片段插件插入。

方法二:直接修改主题模板(适合懂基础代码的用户)

如果主题没有用钩子输出价格,而是直接在模板里写死了,那需要修改产品模板文件:

  1. 找到主题目录下的woocommerce/single-product.php或content-single-product.php
  2. 找到产品标题的代码:
    <?php the_title( '<h1 class="product_title entry-title">', '</h1>' ); ?>
    
  3. 把价格输出代码移到标题前面:
    <?php woocommerce_template_single_price(); ?>
    <?php the_title( '<h1 class="product_title entry-title">', '</h1>' ); ?>
    

注意:一定要用子主题修改,不然主题更新后修改会丢失。

方法三:排查插件冲突

如果上面两种方法都没用,暂时禁用所有WooCommerce相关的第三方插件,逐个重新启用,排查是否有插件修改了价格的钩子优先级。

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.07.10 07:11:02