如何自定义WooCommerce产品页面包屑：移除产品名并保留链接与分隔符

核心问题根因 #

• 原array_pop代码导致分类名变纯文本的原因：WooCommerce 自带的面包屑渲染逻辑会固定将数组的最后一个元素判定为“当前页面”，无论该元素是否配置了跳转地址，都会强制输出为无跳转的纯文本。移除产品名称节点后，原本带链接的分类项成为数组最后一位，自然被改成了不可点击的纯文本。
• 原CSS方案失效的原因：编写的选择器nav.woocommerce-breadcrumb:not(a)选中目标是<nav>标签本身，无法匹配nav内部的纯文本内容，连带分隔符文本也被设置为透明，最终导致分隔符消失。且纯文本节点本身无法通过CSS单独选中，靠CSS根本无法精准区分“要隐藏的产品名”和“要保留的分隔符”，不是稳定的解决方案。

最终可直接使用的修复代码 #

不需要额外调整CSS，全部通过PHP钩子修正逻辑，可实现的效果：

• 产品页面包屑不展示当前产品名称
• 所有剩余面包屑节点（商城、分类）全部保留可跳转链接
• 节点间保留/分隔符，无多余元素

// 移除产品页面包屑中的产品名称，保留分类链接可点击性
add_filter( 'woocommerce_get_breadcrumb', 'tm_child_remove_product_title', 10, 2 );
function tm_child_remove_product_title( $crumbs, $breadcrumb ) {
    if ( is_product() ) {
        // 移除默认最后一个无链接的产品名称节点
        array_pop( $crumbs );
        // 追加空占位节点，让分类项不再是数组最后一位，触发WooCommerce的链接渲染逻辑
        $crumbs[] = [ '', '' ];
    }
    return $crumbs;
}

// 清理渲染后末尾多余的分隔符
add_filter( 'woocommerce_breadcrumb_html', 'tm_child_trim_trailing_delimiter', 10, 1 );
function tm_child_trim_trailing_delimiter( $html ) {
    if ( is_product() ) {
        // 移除末尾多余的斜杠分隔符
        $html = rtrim( $html, " \t\n\r\0\x0B/" );
    }
    return $html;
}

代码生效后的展示效果 #

渲染完成的HTML结构完全匹配需求：

<nav class="woocommerce-breadcrumb">
  <a href="商城链接">Shop</a>
  &nbsp;/&nbsp;
  <a href="分类链接">Snacks</a>
</nav>

所有节点保留跳转能力，分隔符正常显示，无多余的产品名称文本。

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