WooCommerce配送标签不支持HTML渲染，因wp_kses_post()过滤仅保留极少数标签；应使用woocommerce_after_shipping_rate钩子插入HTML，或覆盖模板文件定制。

WooCommerce 默认的配送方式选择是纯文本标签，不支持 HTML 渲染，直接往 $rate->label 里塞 或图标会失效——这是最常踩的坑。

为什么 woocommerce_package_rates 里加 HTML 没用

这个钩子确实能拿到所有配送选项，但 WooCommerce 在最终输出前会对 $rate->label 调用 wp_kses_post() 过滤，只保留白名单内的 HTML 标签（基本只有
、 等极少数）。你写 $rate->label .= '（次日达）'，前端只会看到“（次日达）”四个纯文字。

• 它设计初衷是处理费率逻辑，不是渲染层
• 任何含
  、、 的尝试都会被清空
• 即使绕过过滤（比如用 wp_unslash()），也容易破坏后续 JS 动态更新逻辑

用 woocommerce_after_shipping_rate 插入 HTML 最可靠

这个动作钩子在每个配送选项的 和文本标签之后立即触发，DOM 位置天然适合追加说明性内容，且不经过 label 过滤流程。

• 钩子签名是 do_action( 'woocommerce_after_shipping_rate', $package, $rate )，第二个参数就是当前配送项对象
• 你可以安全输出
  明日14:00前发货
• 配合 CSS 控制显示/隐藏，比如用 [data-index="0"] .shipping-note 只对首项生效
• 注意：必须用 add_action()，不能用 add_filter()；优先级建议设为 10 或更高，避免被其他插件覆盖

模板文件覆盖要改对位置

如果需要更深度定制（比如把单选框换成按钮、加展开详情），就得覆盖 WooCommerce 的模板文件。但别动 cart/shipping-calculator.php——那是地址输入区。真正控制配送列表的是：


Html2md
使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...
下载
• checkout/review-order.php：结算页的配送方式区块
• cart/cart-shipping.php：购物车页的配送方式区块
• 复制对应文件到你的主题目录：yourtheme/woocommerce/checkout/review-order.php
• 关键点：找到 foreach ( $available_methods as $method ) 循环，在 woocommerce_cart_shipping_method_full_label 过滤器调用之后插入你的 HTML

移动端和屏幕阅读器要额外留意

加了图标或小字说明后，别只靠视觉区分。比如用 ? 放图标，再补一句 支持顺丰次日达。否则视障用户听到的可能只是“顺丰速运”，漏掉时效信息。

另外，data-label 属性别乱用——它只在响应式折叠成卡片时起作用，且必须和原始列名严格一致，比如 data-label="运费" 对应表头里的“运费”二字，错一个字，伪元素就标错字段。