如何使用Facebook像素为单页应用程序进行自定义页面跟踪?

Question

我正在使用"create-react-app"在React上开发一个单页应用程序。我想使用 Facebook Pixel 在 Facebook 上进行重定向和创建自定义受众。

例：

每当用户访问/定价时，我都想添加ReactPixel.track('viewPricing')。每当用户访问/结帐时，我都想添加ReactPixel.track('viewCheckout').

由于它是一个单页应用程序，我的所有事件都会同时触发，我想这是有道理的。

您如何为单页应用程序使用自定义页面跟踪和 Facebook 像素？

Answer 1

这是我最终所做的。首先，做npm install react-facebook-pixel。无论您想在哪里包含FB跟踪，请执行以下操作：

import ReactPixel from 'react-facebook-pixel';
const options = {
autoConfig: true,     // set pixel's autoConfig
debug: false,         // enable logs
};
ReactPixel.init('Your-Pixel-Code', options);

这将触发"查看页面"。现在，如果您想包含自定义事件，只需在指向页面的链接中添加一个onClick：

<Button onClick={() => { ReactPixel.track('clickContact') }} variant="contained" color="primary" href="/contact/" >

这是我能找到的最简单的方法。