如何在WooCommerce中挂载AddToCart事件的Facebook Pixel代码？

嘿，我来帮你搞定这个问题！要在用户完成商品加购动作时触发Facebook Pixel的AddToCart事件，不用插件的话，**woocommerce_add_to_cart**就是最适合你的WooCommerce钩子。

为什么选这个钩子？ #

这个钩子会在商品成功添加到购物车后立即触发，完美匹配你的需求——确保追踪代码只在加购动作完成后执行，不会提前触发或遗漏场景。

基础实现代码 #

你可以把这段代码添加到当前主题的functions.php文件中，或者创建一个简单的自定义插件来放置它：

add_action( 'woocommerce_add_to_cart', 'track_add_to_cart_with_facebook_pixel' );
function track_add_to_cart_with_facebook_pixel() {
    // 输出Facebook Pixel追踪代码
    ?>
    <script>
        fbq('track', 'AddToCart');
    </script>
    <?php
}

进阶：传递商品详情参数 #

如果想让追踪数据更精准（比如传递商品价格、数量、ID等信息给Facebook），可以利用钩子提供的参数来扩展代码：

// 指定接收6个钩子参数，用于获取商品详情
add_action( 'woocommerce_add_to_cart', 'track_add_to_cart_with_facebook_pixel', 10, 6 );
function track_add_to_cart_with_facebook_pixel($cart_item_key, $product_id, $quantity, $variation_id, $variation, $cart_item_data) {
    // 获取商品对象
    $product = wc_get_product($product_id);
    // 计算商品总金额
    $total_value = $product->get_price() * $quantity;
    
    ?>
    <script>
        fbq('track', 'AddToCart', {
            value: <?php echo esc_js($total_value); ?>,
            currency: '<?php echo esc_js(get_woocommerce_currency()); ?>',
            content_ids: ['<?php echo esc_js($product_id); ?>'],
            content_type: 'product'
        });
    </script>
    <?php
}

重要注意事项 #

• 请确保你的网站已经正确加载了Facebook Pixel的基础初始化代码（包含fbq('init', '你的像素ID');的那段代码），否则追踪代码无法正常工作。
• 修改主题functions.php前建议先备份文件，或者使用子主题来避免主题更新时代码丢失。

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