Facebook Pixel Tracking

[Matthew Williamson]

Would it be possible for you to add an example for a Facebook Pixel code to the tracking documentation?

[Matthew Williamson]

It looks like the Facebook Pixel Code works similar to Google Tag Manager, where it watches the History State. Can you confirm? I guess the documentation isn't necessary, as it does not require any customization.

[ThaoD5]

Hello @bigskillet ;
We don't have really the time to check the behavior of Facebook Pixel Code.
Although, if you are able to test on your side and provide us the information of the working setup for you, we would appreciate if you could share so we could help other people :-)
Otherwise, we'll have to have a look later on, sorry.

[Sven]

Google Analytics

Tracking the initial page load

When using Google Analytics, you can use the following snippet to track the initial page load. Simply paste the snippet in your site's footer, and replace GA_TRACKING_ID (on both locations) with your Google Analytics Tracking ID.

HTML

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag() {
    dataLayer.push(arguments);
  }
  gtag('js', new Date());
  gtag('config', 'GA_TRACKING_ID');
</script>

Tracking page-transitions

When it comes to page transitions, you can use the following snippet. Don't forget to replace GA_TRACKING_ID with your Google Analytics Tracking ID.

JavaScript

H.on('NAVIGATE_END', ({ to, location }) => {
  if (typeof gtag !== 'undefined') {
    gtag("config", "GA_TRACKING_ID", {
      page_path: location.pathname,
      page_title: to.page.title,
      page_location: location.href,
    });
  }
});

Facebook Pixel

Tracking the initial page load

Integrating FaceBook Pixel is quite similar to integrating Google Analytics. If you use the following snippet, you can simply replace FBP_TRACKING_ID (on both locations) with your Facebook Pixel Tracking ID.

HTML

<script>
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];
  s.parentNode.insertBefore(t,s)}(window, document,'script',
  'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', 'FBP_TRACKING_ID');
  fbq('track', 'PageView');
</script>
<noscript>
  <img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=FBP_TRACKING_ID&ev=PageView&noscript=1"/>
</noscript>

Tracking page-transitions

To track page transitions with Facebook Pixel, use the following snippet.

JavaScript

H.on('NAVIGATE_END', ({ to, location }) => {
  if (typeof fbq !== 'undefined') 
    fbq('track', 'PageView');
  }
});