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:

8 Likes