We are here to help

What is Facebook Pixel tracking?

The Facebook pixel is an analytics tool that allows you to measure the effectiveness of your advertising by understanding the actions people take on your website. You can use pixel data to:

  • Make sure your ads are being shown to the right people.
  • Build advertising audiences.
  • Unlock additional Facebook advertising tools.

How to setup Facebook Pixel Tracking?

Cleeng allows you to setup Facebook Pixel tracking by GTM (How to set GTM in Cleeng link here).
That is the easiest and the most elastic way of setting up and managing Facebook pixel.

 

Before you begin

  1. Create Facebook Pixel - https://www.facebook.com/business/help/952192354843755
  2. Create GTM account and setup in the Cleeng dashboard - for detailed description look at Cleeng Article about GTM.
  3. Now is the time to add that code for all pages in GTM.
  4. Get your GTM ID4.PNG
  5. Place it in the Cleeng Dashboard (link to GTM setup) (Cleeng Dashboard -> Settings -> Broadcaster profile)  5.PNG
  6. Create triggers for each step of authentication / checkout process (create link to Cleeng GTM article with proper section about GTM)
  7. Create custom HTML TAG in GTM (create link to Cleeng GTM article with proper section about GTM)
  8. Create custom user variables (create link to Cleeng GTM article with proper section about GTM)

When you are done you can go through the next steps of setting up Facebook Pixel tracking.

 

Add your Facebook pixel to your pages

Get your pixel code

  1. Open your pixel page  p1.PNG
  2. Choose Pixel
  3. Click the “Set up” button  p3.PNG
  4. Choose “Manually Install the Code Yourself”  p4.PNG
  5. Copy your code  p5.PNG
  6. At this point you can remove <noscript>...<noscript> part because for non script users GTM wouldn’t work here so there is no sense to keep it.

 

Add Facebook Pixel Tracking to all pages

  1. Create new TAG (GTM -> Tags -> New)
  2. Choose Custom HTML type
  3. Paste previously copied code
  4. In “Tag firing option” set “Once per page”
  5. Right now your new tag should look like this  fb5.PNG
  6. Add Trigger for that TAG
  7. Click on trigger section and add new one
  8. Choose predefined “All pages” trigger  fb8.PNG
  9. Save it and refresh preview
  10. Right now in preview mode your debug panel should appear at the bottom of the page  fb10.PNG

 

Setup Facebook Pixel events to the each step

During setup of FB events you have to remember to check “Fire a tag before FB - AddPaymentInfo fires” and selecting “FB Pixel”.  setup.PNG

That will let us know about the proper sequencing of executing Custom HTML scripts. You can create conversion tracking for many steps: s1.PNG

Thanks to GTM, you can setup a few events according to FB documentation

  • Add Payment Info
  • Complete Registration
  • Initiate Checkout
  • Purchase
  • View Content

 

Setup “View Content” FB event

That event should be associated with the trigger for “viewEvent” custom Event.

Basic

Advanced (using variables for Dynamic Product Ads)

<script>

 fbq('track', 'ViewContent', { });

</script>

<script>

 fbq('track', 'ViewContent', {

   content_name: {{eventTitle}},

   content_ids: [{{eventId}}],

content_type: 'product',

   value: {{eventPrice}},

   currency: {{eventCurrency}},

   referrer: document.referrer,

   userAgent: navigator.userAgent,

   language: navigator.language

 });

</script>

 

Setup “Initiate Checkout” FB event
That event should be associated with the trigger for “buyButtonClick” custom Event.

 

Basic

Advanced (using variables for Dynamic Product Ads)

<script>

 fbq('track', 'InitiateCheckout', { });

</script>

<script>

 fbq('track', 'InitiateCheckout', {

   content_name: {{eventTitle}},

   content_ids: [{{eventId}}],

   content_type: 'product',

   value: {{eventPrice}},

   currency: {{eventCurrency}},

   referrer: document.referrer,

   userAgent: navigator.userAgent,

   language: navigator.language

 });

</script>



 

Setup “'Complete Registration'” FB event
That event should be associated with the trigger for “registrationComplete” custom Event.

Basic

Advanced (using variables for Dynamic Product Ads)

<script>

 fbq('track', 'CompleteRegistration', { });

</script>

<script>

 fbq('track', 'CompleteRegistration', {

   content_name: {{eventTitle}},

   value: {{eventPrice}},

   currency: {{eventCurrency}}

 });

</script>




 

Setup “'Add Payment Info'” FB event
That event should be associated with the trigger for “paymentInfoSubmit” custom Event.

Basic

Advanced (using variables for Dynamic Product Ads)

<script>

 fbq('track', 'AddPaymentInfo', { });

</script>

<script>

 fbq('track', 'AddPaymentInfo', {

   content_name: {{eventTitle}},

   content_ids: [{{eventId}}],

   content_type: 'product',

   value: {{eventPrice}},

   currency: {{eventCurrency}},

   referrer: document.referrer,

   userAgent: navigator.userAgent,

   language: navigator.language

 });

</script>





 

Setup “'Purchase'” FB event
That event should be associated with the trigger for “purchaseComplete” custom Event.

Basic

Advanced (using variables for Dynamic Product Ads)

<script>

 fbq('track', 'Purchase', { });

</script>

<script>

 fbq('track', 'Purchase', {

   content_name: {{eventTitle}},

   content_ids: [{{eventId}}],

   content_type: 'product',

   value: {{eventPrice}},

   currency: {{eventCurrency}},

   referrer: document.referrer,

   userAgent: navigator.userAgent,

   language: navigator.language

 });

</script>