Shopify-Facebook_Pixel.liquid

{% comment %}
  Adds the following events: 
  * ViewContent on all pages
  * Dynamic AddToCart on Product pages
  * Dynamic InitiateCheckout from Cart page into Checkout
  * Purchase on Checkout complete 
{% endcomment %}
<!-- Shopify Theme Facebook Pixel Code -->
<script type="text/javascript">
  !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','//connect.facebook.net/en_US/fbevents.js');
  fbq('init', '<FB_PIXEL_ID>'); // insert your custom audience pixel ID
  fbq('track', 'PageView');
  fbq('track', 'ViewContent', {
    content_name: '{{ page_title }}',
    content_category: '{{ template | replace: '.', ' ' | truncatewords: 1, '' | handle }}'
  });
  {% case template %}
    {% when 'product' %}
      $('#add').click(function() {
        fbq('track', 'AddToCart', {
          content_name: '{{ product.title }}',
          content_type: 'Product',
          content_category: '{{ product.type }}',
          content_ids: ['{{ product.id }}'],
          value: {{ product.price | money_without_currency }},
          currency: 'USD'
        });
      });
    {% when 'cart' %}
      $('#checkout').click(function(){
        fbq('track', 'InitiateCheckout');
      });
  {% endcase %}

</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=<FB_PIXEL_ID>&amp;ev=PageView&amp;noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->

<!-- Shopify Admin "Additional Content & Scripts" Facebook Pixel Code -->
<script type="text/javascript">
  !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','//connect.facebook.net/en_US/fbevents.js');

  fbq('init', '<FB_PIXEL_ID>');
  fbq('track', 'PageView');
  fbq('track', 'Purchase', {
    value: '{{ subtotal_price | money_without_currency }}', 
    currency: 'USD'
  });
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=<FB_PIXEL_ID>&amp;ev=PageView&amp;noscript=1&amp;cd[value]={{ subtotal_price | money_without_currency }}&amp;cd[currency]=USD"
/></noscript>
<!-- End Facebook Pixel Code -->