@ClosDesign, you're on the right track! As you suspected, you can call fbq('init', '[your-pixel-id]') several times, which adds each pixel identifier to the list of identifiers in which all events will be tracked. I wrote a blog post about this issue of using multiple Facebook pixels on a single site, so read there for more details.
Using the sample code, you first want to include the Facebook JavaScript pixel code. This will load the JavaScript from Facebook, which is necessary to send pixel events using the fbq object:
!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');
Then, the init time of all pixel IDs:
fbq('init', 'xxxxxxxxxxxxx12'); fbq('init', 'xxxxxxxxxxxxx34'); fbq('init', 'xxxxxxxxxxxxx56');
After initializing all the pixel identifiers on your site with fbq('init') use the Facebook Pixel Helper to confirm that all the pixels have been loaded. You can also manually confirm that they were downloaded by running the following code in the JavaScript console:
fbq.getState().pixels
After that, any calls you make to the track event will be tracked by all the pixel identifiers that you initialized above. Therefore, if you call:
fbq('track', "PageView");
Event
A PageView will be sent to Facebook for all three pixels. Your Purchase event works the same.
When it comes to Facebook <noscript> tags, you will need to add an <img> for each pixel identifier that you want to call on your site:
<noscript> <img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=xxxxxxxxxxxxx12&ev=PageView&noscript=1" /> <img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=xxxxxxxxxxxxx34&ev=PageView&noscript=1" /> <img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=xxxxxxxxxxxxx56&ev=PageView&noscript=1" /> </noscript>
Note that if the user has disabled JavaScript, those <img> tags send a request to Facebook to track the PageView event. The Purchase event will not be tracked unless you create another <img> for each pixel identifier and provide data to track the Purchase event.
Naturally, the following question: "Can I track an event for only one of the many pixels initialized on my site?" Do not use Facebook fbq object, no.
However, there is a workaround . Using the <img> above, you can post events to Facebook and track the event with only one pixel identifier. This method completely bypasses the fbq object and dynamically creates an <img> with the event information that you specify.
code
(function (window, document) { if (window.myfbq) return; window.myfbq = (function () { if (arguments.length > 0) { var pixelId, trackType, contentObj; if (typeof arguments[0] == 'string') pixelId = arguments[0]; if (typeof arguments[1] == 'string') trackType = arguments[1]; if (typeof arguments[2] == 'object') contentObj = arguments[2]; var params = []; if (typeof pixelId === 'string' && pixelId.replace(/\s+/gi, '') != '' && typeof trackType === 'string' && trackType.replace(/\s+/gi, '')) { params.push('id=' + encodeURIComponent(pixelId)); switch (trackType) { case 'PageView': case 'ViewContent': case 'Search': case 'AddToCart': case 'InitiateCheckout': case 'AddPaymentInfo': case 'Lead': case 'CompleteRegistration': case 'Purchase': case 'AddToWishlist': params.push('ev=' + encodeURIComponent(trackType)); break; default: return; } params.push('dl=' + encodeURIComponent(document.location.href)); if (document.referrer) params.push('rl=' + encodeURIComponent(document.referrer)); params.push('if=false'); params.push('ts=' + new Date().getTime()); if (typeof contentObj == 'object') { for (var u in contentObj) { if (typeof contentObj[u] == 'object' && contentObj[u] instanceof Array) { if (contentObj[u].length > 0) { for (var y = 0; y < contentObj[u].length; y++) { contentObj[u][y] = (contentObj[u][y] + '').replace(/^\s+|\s+$/gi, '').replace(/\s+/gi, ' ').replace(/,/gi, '§'); } params.push('cd[' + u + ']=' + encodeURIComponent(contentObj[u].join(',').replace(/^/gi, '[\'').replace(/$/gi, '\']').replace(/,/gi, '\',\'').replace(/§/gi, '\,'))); } } else if (typeof contentObj[u] == 'string') params.push('cd[' + u + ']=' + encodeURIComponent(contentObj[u])); } } params.push('v=' + encodeURIComponent('2.7.19')); var imgId = new Date().getTime(); var img = document.createElement('img'); img.id = 'fb_' + imgId, img.src = 'https://www.facebook.com/tr/?' + params.join('&'), img.width = 1, img.height = 1, img.style = 'display:none;'; document.body.appendChild(img); window.setTimeout(function () { var t = document.getElementById('fb_' + imgId); t.parentElement.removeChild(t); }, 1000); } } }); })(window, document);
Using
myfbq("[your-pixel-id]", "PageView"); myfbq("[your-pixel-id]", "ViewContent"); myfbq("[your-pixel-id]", "ViewContent", { content_type: "product", content_ids: ['892185001003'] });