请求协助调整WooCommerce结账页面运费至小计与总计同列
调整WooCommerce结账页面运费位置的解决方案
方法1:使用WooCommerce钩子实现(推荐,无需修改模板)
通过钩子移除默认运费显示,再在小计与总计之间插入结构一致的运费行,确保和小计、总计处于同一列。将以下代码添加到子主题的functions.php文件中,或使用自定义代码插件(如Code Snippets)添加:
// 移除默认的运费显示区域 add_action( 'init', 'remove_default_shipping_display' ); function remove_default_shipping_display() { remove_action( 'woocommerce_cart_totals_shipping_html', 'woocommerce_cart_totals_shipping_html', 10 ); remove_action( 'woocommerce_review_order_after_shipping', 'woocommerce_review_order_after_shipping', 10 ); } // 在订单总计前插入自定义运费行 add_action( 'woocommerce_cart_totals_before_order_total', 'insert_shipping_between_subtotal_and_total' ); add_action( 'woocommerce_review_order_before_order_total', 'insert_shipping_between_subtotal_and_total' ); function insert_shipping_between_subtotal_and_total() { global $woocommerce; if ( WC()->cart->needs_shipping() && WC()->cart->show_shipping() ) { $shipping_methods = WC()->cart->get_shipping_methods(); if ( ! empty( $shipping_methods ) ) { ?> <tr class="shipping"> <th><?php _e( '运费', 'woocommerce' ); ?></th> <td data-title="<?php esc_attr_e( '运费', 'woocommerce' ); ?>"> <?php $shipping_total = WC()->cart->get_shipping_total(); $shipping_tax = WC()->cart->get_shipping_tax(); if ( WC()->cart->display_prices_including_tax() ) { $shipping_total += $shipping_tax; } echo wc_price( $shipping_total ); // 如需显示运费税,可取消下方注释 // echo '<small class="shipping-tax">' . wc_price($shipping_tax) . ' ' . __( '税', 'woocommerce' ) . '</small>'; ?> </td> </tr> <?php } } }
方法2:修改结账模板文件(适合熟悉模板结构的用户)
通过复制并修改WooCommerce核心模板,调整运费行的位置:
- 找到WooCommerce插件目录下的
templates/cart/cart-totals.php和templates/checkout/review-order.php文件 - 将这两个文件复制到子主题目录的
woocommerce/cart/和woocommerce/checkout/路径中(目录不存在则新建) - 打开复制后的文件,找到带有
shipping类的<tr>运费代码块,将其剪切到小计(subtotal类的<tr>)和总计(order-total类的<tr>)之间 - 保存文件后刷新结账页面即可生效
注意:修改模板后,WooCommerce大版本更新时需对比官方模板差异,同步更新子主题内的模板文件,避免兼容性问题。
内容的提问来源于stack exchange,提问作者Éxodo
相关产品推荐
相关产品推荐

