WooCommerce子主题覆写single add-to-cart模板无效如何解决？

问题原因 #

• 子主题模板路径填写错误：WooCommerce默认的子主题模板覆写规则要求，自定义模板必须放在子主题根目录下的woocommerce文件夹内，你当前存放在/CHILD-THEME/templates/woocommerce/路径不符合规则，所以不会被加载。
• 页面构建工具优先级覆盖：JetWooBuilder、Elementor自定义单产品模板的加载优先级高于子主题WooCommerce模板，只要你启用了这两个工具的自定义单产品页配置，默认的WooCommerce模板层级就会被绕过，子主题修改自然不生效。
• 缓存未清理：网站静态缓存、浏览器缓存、Elementor/JetWooBuilder的内置缓存都可能导致修改后无法即时看到效果。

解决办法 #

方案1：修正模板路径（适用未用JetWooBuilder自定义单产品页的场景） #

将子主题/templates/woocommerce/目录下的所有WooCommerce自定义模板整体移动到子主题根目录，最终simple.php的路径为/CHILD-THEME/woocommerce/single-product/add-to-cart/simple.php，修改完成后清理所有缓存后测试即可。

方案2：用钩子注入自定义属性（优先推荐，无需修改模板） #

不需要覆写模板文件，直接在子主题functions.php中添加对应钩子代码即可给加购按钮插入自定义data属性，不受页面构建工具的模板覆盖影响：

// 给单产品页加购按钮添加自定义属性
add_filter( 'woocommerce_single_product_add_to_cart_attributes', 'custom_add_cart_data_attr', 10, 2 );
function custom_add_cart_data_attr( $attributes, $product ) {
    // 插入自定义价格属性，可根据需求增加更多属性
    $attributes['data-custom-price'] = $product->get_price();
    $attributes['data-custom-product-sku'] = $product->get_sku();
    return $attributes;
}

// 给商品列表页加购按钮添加自定义属性（按需添加）
add_filter( 'woocommerce_loop_add_to_cart_args', 'custom_loop_add_cart_data_attr', 10, 2 );
function custom_loop_add_cart_data_attr( $args, $product ) {
    $args['attributes']['data-custom-price'] = $product->get_price();
    $args['attributes']['data-custom-product-sku'] = $product->get_sku();
    return $args;
}

方案3：适配JetWooBuilder/Elementor配置（适用必须修改模板的场景） #

如果必须使用自定义模板文件，进入JetWooBuilder的设置页面，找到单产品页的模板配置，关闭加购模块的自定义模板开关，恢复WooCommerce默认模板加载逻辑即可。也可以直接在Elementor/JetWooBuilder的单产品模板编辑器中，手动修改加购按钮的代码，插入你需要的自定义data属性。

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