I'm still pretty new to Javascript, but I was wondering what would be the best way to fire the Facebook conversion pixel (below) without actually loading a "confirmation"/"Thank You" page?
<script type="text/javascript">
var fb_param = {};
fb_param.pixel_id = 'XXXXXXXXXXX';
fb_param.value = '0.00';
fb_param.currency = 'USD';
(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=XXXXXXXXXX&value=0&currency=USD" /></noscript>
Facebook says that we should plug this into our "Thank You pages" that visitors see after they convert (fill out a form, make a purchase, etc). However, some of our forms are popups or forms on sidebars next to content that we don't want readers to be directed away from by a confirmation page.
With Google Analytics, I can create an "invisible" pageview by firing _gaq.push(['_trackPageview']); code that can tell GA that it should count that invisible pageview as a goal completion.
Is there something similar to that that's general enough to tell my site to fire the FB pixel?
A conversion pixel is a piece of code that is provided to advertisers to place on a website landing page. It allows brands to track and report on the actions of users who visit their page after viewing or clicking on an ad.
This means that the pixel ID in your Facebook pixel base code hasn't been recognized by Facebook. To fix this, you'll need to replace the pixel ID in your pixel base code with the pixel ID assigned to an active ad account.
In order to check to see if your Facebook Pixel is firing properly, you'll want to use the Google Chrome browser. You can then install the Facebook Pixel Helper Chrome Extension, which is basically a tool that will show you if it detects a pixel on your website. You can download the Facebook Pixel Helper here.
In your Facebook Ads Manager, click on the menu button in the top-left corner and click All Tools at the bottom of the menu. Then under the Assets column, click Pixels. This opens the pixels dashboard. Under Conversion Tracking Pixel (Old), click the Create Conversion button.
Custom Conversions. Each time the Pixel loads, it automatically calls fbq('track', 'PageView') to track a PageView standard event.
EDIT: I've updated my code as what I had mentioned previously did not work. Thanks to @Flambino to pointing out.
This is my revised answer using a pixel rather than a script to pass the conversion pixel. I reference the How to track a Google Adwords conversion onclick? SO post:
<head>
<script type="text/javascript">
function facebookConversionPixel(fb_pixel, fb_value){
var image = new Image(1,1);
image.src = "//www.facebook.com/offsite_event.php?id=" + fb_pixel + "&value=" + fb_value + "&currency=USD";
}
</script>
</head>
<body>
<a href="#" onclick="facebookConversionPixel(123456,0.00);">FBCONV</a>
</body>
From the FB docs "How to track in-page events":
After the base code snippet is installed, you can track in-page actions, such as clicks on a button, by making a _fbq.push('track') call for the conversion pixel through registering different event handlers on an HTML DOM element. For example:
function trackConversionEvent(val, cny) {
var cd = {};
cd.value = val;
cd.currency = cny;
_fbq.push(['track', '<pixel_id>', cd]);
}
<button onClick="trackConversionEvent('10.00','USD');" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With