使用woocommerce_sale_flash钩子后WooCommerce产品永久链接失效

你在替换WooCommerce售罄徽章为WhatsApp链接后出现产品链接失效的问题，核心原因及解决办法如下：

问题根源 #

1. 产品属性调用错误：WooCommerce 3.0+版本后，不能直接通过$product->name访问产品名称，需使用官方提供的get_name()方法，直接访问属性会导致变量解析异常，破坏HTML结构。
2. 无效链接字符：电话号码中的**是多余字符，会导致WhatsApp链接无法正常跳转。
3. HTML结构冲突：在产品卡片的<a>标签内部嵌套新的<a>标签（WhatsApp链接），违反HTML规范，浏览器解析时会出现异常，导致产品原有链接失效。

修改后的代码 #

add_filter( 'woocommerce_sale_flash', 'jabir_change_badge', 99, 3 );

function jabir_change_badge( $badge_html, $post, $product ) {
    // 正确获取并编码产品名称
    $product_name = urlencode( $product->get_name() );
    // 构造合法的WhatsApp链接
    $whatsapp_url = "https://api.whatsapp.com/send?phone=9173839776&text=I%20am%20interested%20{$product_name}";
    
    // 用span替代a标签，通过点击事件跳转，避免嵌套冲突
    return "<span class='onsale whatsapp-badge' onclick=\"window.open('{$whatsapp_url}', '_blank')\">
                <i class='fa fa-whatsapp fa-lg' aria-hidden='true'></i>
            </span>";
}

额外优化 #

可添加CSS确保徽章的点击交互体验：

.whatsapp-badge {
    cursor: pointer;
    /* 可保留原有onsale样式，或自定义外观 */
}

内容的提问来源于stack exchange，提问作者MR. shaikh__92