Installing Facebook pixel to WHMCS 7

facebook-pixel-whmcs

I’ve just been banging my head against the desk trying to install the Facebook Pixel code to WHMCS 7 manually. I want to track hosting order completion to see how well Facebook ads convert.

The problem

Adding the Facebook pixel code to header.tpl hosed the WHMCS front end template.

The fix

WHMCS templates need the Facebook pixel Javascript code wrapping in {literal} tags to stop it wrecking the output.

https://forum.whmcs.com/showthread.php?89883-Adding-Facebook-ads-conversion-pixel-to-thank-you-order-complate-page

End result:

{literal}
 <!-- Facebook Pixel Code -->
 <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', '123456'); // Insert your pixel ID here.
 fbq('track', 'PageView');
 </script>
 <noscript><img height="1" width="1" style="display:none"
 src="https://www.facebook.com/tr?id=123456&ev=PageView&noscript=1"
 /></noscript>
 <!-- DO NOT MODIFY -->
 <!-- End Facebook Pixel Code -->
{/literal}

I’ve changed my pixel ID to 123456 – so don’t copy and paste this code. Note the {literal} tags before and after the Facebook code.