Meta Pixel
Meta pixel is a handy piece of code that monitors user’s behaviour on a website. Do you want to display ads to people who visited your website or purchased products from your eshop? Pixel will help you 😉.
Create a pixel in Business Manager and follow the detailed instructions on how to install it to your website. Does the programming stuff look complicated? Your IT department will help you.
For more information, check the Meta Advertiser Help Center.
Pixel Events
As a next step, you should add events. An event is any action that happens on your website that can be tracked (like “Purchase” or “Complete Registration”) and Pixel will constantly monitor it.
Meta offers 9 predefined events with the most common actions that you can easily use.
If you need a more complicated event, create Custom Event by defining the Custom Conversion in Business Manager
Insert Conversion Value or Currency to the code to measure additional information about your event. You know, data is important 😀
Copy the event code and paste it on the relevant page of your site. Be sure not to modify the pixel code you've already placed in the header of your website.
Check if your Pixel works correctly
Once you add all events, you may want to check if everything works correctly. To do this, install Chrome add-on Facebook Pixel Helper. A small square icon will be added next to the search bar.
Every time you enter a website with any pixel, you will see a small green number below the icon. Click it:
if you see a green checkmark, the pixel works correctly
if you see a red triangle, there is an error
😺 Hint for happier marketers 😺
To ensure that everything is set correctly, check if the product ID on the website (using Pixel Helper) matches with ID in your product feed.
How to implement a pixel on your Web-page?
Step 1:
First of all, please paste following code before </HEAD> tag on all of your website pages:
<!-- 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', '1391867461073479');fbq('track', "PageView");</script><noscript><img height="1" width="1" style="display:none"src="https://www.facebook.com/tr?id=1391867461073479&ev=PageView&noscript=1"/></noscript><!-- End Facebook Pixel Code --><script>/*// For Dynamic Product Ads please make sure that you have implemented ViewContent, AddToCart and Purchase events.// Dynamic Product Ads cannot work without events and catalogues with matching SKUs.// Events are used for specific pages / actions.//// Events are described below.//// We recommend placing the pixel code between the <head> sections of the website.// -----------------// Event ViewContent// Add this code to the Product Detail Page.// <product_id> has to be replaced by ID of product (ID matching SKU in your XML Product Feed)// content_type is constant string 'product' - don't change itfbq('track', 'ViewContent', {content_ids: ['<product_id>'], content_type: 'product'});// -----------------// Event AddToCart// If your eCommerce platform has a separate page when product is added to cart, use this part of code on this page.fbq('track', 'AddToCart', {content_ids: ['<product_id>'], content_type: 'product'});// -----------------// Event Purchase// Add this code on the Thank You Page (order is finished).// content_ids field is array of products IDs (they have to match SKUs in your XML Product Feed)fbq('track', 'Purchase', {content_ids: ['<product_id_1>', '<product_id_2>', '<product_id_3>'], content_type: 'product'});*/</script>
Step 2:
Verify that your Meta Pixel works properly with Facebook Pixel Helper.
Step 3:
Instruction on how to Implement pixel in the most known E-commerce platforms (Shopify, WooCommerce, Magento, ...).
Step 4:
Pair your Meta Pixel and your Product catalog.