How to add Facebook Pixel to a Discourse site

:warning: The pixel won’t send any data if you use an ad-blocking software. Sometimes the extension will show the pixel with a message saying that no data was sent, sometimes it won’t show anything. It’s important to turn your ad-blocker OFF when you test the pixel. :warning:

  1. Go to the Facebook Pixel page and follow the instructions to get and configure your Pixel code.

  2. Select "Manually add pixel code to website"

  3. Copy your Pixel code

  4. Create a new theme component and paste the code in the common > /body tab. If there is more than one theme on your site, remember to add the component to each user-selectable theme.
    image

  5. Whitelist the source URLs in the content security policy script src site setting


    image

  6. Go back to the Pixel Facebook page and enter the URL of your site to test the code and then click on the Send Test Traffic button.


  7. If all is fine you will see a green bubble
    image

  8. (Optional) Using Chrome is it possible to check if the Pixel is working adding the appropriate extension. Go to Chrome Web Store and search for Facebook Pixel Helper. When the extension is installed it will be possible to check directly from the browser navigation bar.
    image

  9. Visiting https://www.facebook.com/events_manager you will see the Pixel statistics

Done :tada:

12 Likes

I have same problem.

Which part of the steps in the first post are you having trouble with? Have you double-checked each step?

Installed it as per the instructions above including adding the content security policy script src URL’s (2 of them) but the Facebook Pixel Helper gives an error

We detected event code but the pixel has not activated for this event, so no information was sent to Facebook. This could be due to an error in the code, but could also occur if the pixel fires on a dynamic event such as a button click.

So I had a look at: Pixel Helper - Facebook Pixel - Documentation - Facebook for Developers which suggests it could an loading/encoding issues and also at Implementation - Facebook Pixel - Documentation - Facebook for Developers which recommends that script be inserted in the <head> rather then the <body> as outlined in the first post, could this be the reason?

I’ve checked that ad blockers and pop up blockers are disabled in the browser.

Any suggestions?