Add Facebook Pixel Code to Magento Success Page

Facebook Pixel Code is a new and even more complicated way to annoy web developers, so on top of all the Google Analytics we now have even more random JavaScript to drop into pages already growing under the weight of like and share buttons, analytics tracking, advert tracking on top of the code that actually makes the website work. Good times.

Anyhoo, this is the process for adding a successful order tracking. It all takes place on the success.phtml page or your theme so go ahead and open the file: app\design\frontend\PACKAGE\THEME\template\checkout\success.phtml

Facebook conversion tracking requires the order total. Add the following PHP to set the last order to an amount variable which can be reused later in the tracking code.

<?php
//Get Order Number & Order Total
$order = Mage::getModel('sales/order')->loadByIncrementId(Mage::getSingleton('checkout/session')->getLastRealOrderId());
$amount = number_format($order->getGrandTotal(),2);
?>

Finally, add the Facebook conversion code itself. Be sure to substitute the 100000001 below with the value form your Facebook conversion code – it appears twice in the JavaScript and the Image SRC. Also you may need to modify the currency parameter, again it appears twice.

<script type="text/javascript">
var fb_param = {};
fb_param.pixel_id = '100000001';
fb_param.value = '<?php echo $amount; ?>';
fb_param.currency = 'GBP';
(function(){
  var fpw = document.createElement('script');
  fpw.async = true;
  fpw.src = '//connect.facebook.net/en_US/fp.js';
  var ref = document.getElementsByTagName('script')[0];
  ref.parentNode.insertBefore(fpw, ref);
})();
</script>
<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/offsite_event.php?id=100000001&value=<?php echo $amount; ?>&currency=GBP" /></noscript>

You can now go ahead and test to confirm.