Skip to content

Instantly share code, notes, and snippets.

@danielmcclure
Last active January 14, 2024 14:54
Show Gist options
  • Star 60 You must be signed in to star a gist
  • Fork 30 You must be signed in to fork a gist
  • Save danielmcclure/8e532e1e360712ccbcbe to your computer and use it in GitHub Desktop.
Save danielmcclure/8e532e1e360712ccbcbe to your computer and use it in GitHub Desktop.
Sample Facebook Standard Events for New Facebook WCA (Website Custom Audience) Pixel
<!-- Facebook Custom Audience Pixel Code - Placed on Every Page of Site -->
<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','//connect.facebook.net/en_US/fbevents.js');
fbq('init', '{{facebook pixel}}');
fbq('track', 'PageView');
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=PageView&noscript=1" />
</noscript>
<!-- End Facebook Custom Audience Pixel Code -->
<!-- Facebook Paramater Guide
// Recommended For Every Event - This is used to calculate ROAS (Return On Ad Spend) and does not have to be an actual transaction value.
value: value of a user performing this event to the business // cd[value]=
currency: currency for the value specified // cd[currency]=
// Required for Dynamic Product Ads
content_ids: Product ids associated with the event. e.g. SKUs of products for AddToCart event: ['ABC123', 'XYZ789'] // cd[content_ids]=
content_type: Either 'product' or 'product_group' based on the content_ids being passed. If the ids being passed in content_ids parameter are ids of products then the value should be 'product'. If product group ids are being passed, then the value should be 'product_group'. // cd[content_type]=
// Everything Else
content_name: Name of the page/product // cd[content_name]=
content_category: Category of the page/product // cd[content_category]=
content_ids: Product ids associated with the event. e.g. SKUs of products for AddToCart event: ['ABC123', 'XYZ789'] // cd[content_ids]=
content_type: Either 'product' or 'product_group' based on the content_ids being passed. If the ids being passed in content_ids parameter are ids of products then the value should be 'product'. If product group ids are being passed, then the value should be 'product_group'. // cd[content_type]=
num_items: Used with InitiateCheckout event. The number of items that checkout was initiated for. // cd[num_items]=
search_string: Used with the Search event. The string entered by the user for the search // cd[search_string]=
status: Used with the CompleteRegistration event, to show the status of the registration. // cd[status]=
-->
<!-- Facebook Conversion Event: View Content -->
<script>
fbq('track', 'ViewContent', {
value: 0.10,
currency: 'USD',
content_name: 'Content Name',
content_type: 'product', // Required for Dynamic Product Ads
content_ids: 'woo-123' // Required for Dynamic Product Ads
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=ViewContent&cd[value]=0.10&cd[currency]=USD&cd[content_name]=Content%20Name&cd[content_type]=product&cd[content_ids]=woo-123&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: View Content -->
<!-- Facebook Conversion Event: Search -->
<script>
var searchString = document.getElementsByClassName('search-field')[0].value;
fbq('track', 'Search', {
value: 0.10,
currency: 'USD',
content_category: 'snippets',
content_ids: 'woo-123',
search_string: searchString
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=Search&cd[value]=0.10&cd[currency]='USD'&cd[content_category]=snippets&cd[content_ids]=woo-123&cd[search_string]=searchString&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Search -->
<!-- Facebook Conversion Event: Add to cart -->
<script>
fbq('track', 'AddToCart', {
value: 10.00,
currency: 'USD',
content_name: 'Product Name',
content_type: 'product', // Required for Dynamic Product Ads
content_ids: 'woo-123' // Required for Dynamic Product Ads
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=AddToCart&cd[value]=10.00&cd[currency]=USD&cd[content_name]=Product%20Name&cd[content_type]=product&cd[content_ids]=woo-123&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Add to cart -->
<!-- Facebook Conversion Event: Add to wishlist -->
<script>
fbq('track', 'AddToWishlist', {
value: 0.10,
currency: 'USD',
content_name: 'Product Name',
content_category: 'snippets',
content_ids: 'woo-123',
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=AddToWishlist&cd[value]=0.10&cd[currency]='USD'&cd[content_name]=Product%Name&cd[content_category]=snippets&cd[content_ids]=woo-123&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Add to wishlist -->
<!-- Facebook Conversion Event: Initiate Checkout -->
<script>
fbq('track', 'InitiateCheckout', {
value: 0.10,
currency: 'USD',
content_name: 'Checkout',
content_category: 'snippets',
content_ids: 'woo-123',
num_ids: 1
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=InitiateCheckout&cd[value]=0.10&cd[currency]='USD'&cd[content_name]=Checkout&cd[content_category]=snippets&cd[content_ids]=woo-123&cd[num_items]=1&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Initiate Checkout -->
<!-- Facebook Conversion Event: Add payment info -->
<script>
fbq('track', 'AddPaymentInfo', {
value: 0.10,
currency: 'USD',
content_category: 'snippets',
content_ids: 'woo-123'
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=AddPaymentInfo&cd[value]=0.10&cd[currency]='USD'&cd[content_category]=snippets&cd[content_ids]=woo-123&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Add payment info -->
<!-- Facebook Conversion Event: Purchase -->
<script>
fbq('track', 'Purchase', {
value: 10.00,
currency: 'USD',
content_name: 'Product Name',
content_type: 'product',
content_ids: 'woo-123',
num_items: 1
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=Purchase&cd[value]=10.00&cd[currency]=USD&cd[content_name]=Product%20Name&cd[content_type]=product&cd[content_ids]=woo-123&cd[num_items]=1&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Purchase -->
<!-- Facebook Conversion Event: Lead -->
<script>
fbq('track', 'Lead', {
value: 0.10,
currency: 'USD',
content_name: 'Report',
content_category: 'B2B'
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=Lead&cd[value]=0.10&cd[currency]='USD'&cd[content_name]=Report&cd[content_category]=B2B&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Lead -->
<!-- Facebook Conversion Event: Complete Registration -->
<script>
fbq('track', 'CompleteRegistration', {
value: 0.10,
currency: 'USD',
content_name: 'Signup',
status: 'complete'
});
</script>
<noscript>
<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=CompleteRegistration&cd[value]=0.10&cd[currency]='USD'&cd[content_name]=Signup&cd[status]=complete&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Complete Registration -->
@RobertBalkovec
Copy link

Hello Daniel.

For example:

-
fbq('track', 'Purchase', {
value: 10.00,
currency: 'USD',
content_name: 'Product Name',
content_type: 'product',
content_ids: 'woo-123',
num_items: 1
});

-

This code goes only to thank you page in Shopify. Which parameters must i change for Shopify

@danielmcclure
Copy link
Author

Apologies on not catching this comment sooner. Your question isn't entirely clear though.

Generally speaking you would need to either add in dynamic variables provided by Shopify or static values based on what was sold. The actual implementation of the values varies from site to site but the paramater labels would largely remain the same.

@eberat
Copy link

eberat commented Apr 6, 2017

hi Daniel,

by using the code for searchString. where should I paste this code.

because im trying to past this between head tags and it look like this

<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', 'myid'); // pixel ID
			<script>
				var searchString = document.getElementsByClassName('mdl-textfield__input')[0].value;
					fbq('track', 'Search', { 
						value: 0.10,
						currency: 'USD',
						content_category: 'snippets',
						content_ids: 'woo-123',
						search_string: searchString
						});
			</script>
			<noscript>
				<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={myid}}&ev=Search&cd[value]=0.10&cd[currency]='USD'&cd[content_category]=snippets&cd[content_ids]=woo-123&cd[search_string]=searchString&noscript=1" />
			</noscript>
		</script>

And it doesn't work!!

so please how should look my head and where should I past this searchString code?

thank you,

@danielmcclure
Copy link
Author

danielmcclure commented Apr 18, 2017

You shouldn't need to be nesting the script tags, they can go after the core Facebook pixel is initialised. So the first event tracks the pageview and the second search event piggybacks off the core pixel. You may also need to customise the actual search string code ( var searchString = document.getElementsByClassName('search-field')[0].value; ) depending on how your site is set up.

So for example:

<!-- Facebook Custom Audience Pixel Code - Placed on Every Page of Site -->
<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','//connect.facebook.net/en_US/fbevents.js');
fbq('init', '{{facebook pixel}}');
fbq('track', 'PageView');
</script>
<noscript>
	<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=PageView&noscript=1" />
</noscript>

<!-- Facebook Conversion Event: Search -->
<script>
var searchString = document.getElementsByClassName('THISISMYACTUALCLASSNAME')[0].value;
	fbq('track', 'Search', { 
		value: 0.10,
		currency: 'USD',
		content_category: 'snippets',
		content_ids: 'woo-123',
		search_string: searchString
    	});
</script>
<noscript>
	<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id={{facebook pixel}}&ev=Search&cd[value]=0.10&cd[currency]='USD'&cd[content_category]=snippets&cd[content_ids]=woo-123&cd[search_string]=searchString&noscript=1" />
</noscript>
<!-- End Facebook Conversion Event: Search -->

You can also get some examples on how you can next the code here: https://www.facebook.com/business/help/952192354843755

@moochdt003
Copy link

moochdt003 commented Jul 17, 2017

Hey guys, I'm a developer. I'm busy setting up Standard tracking on an e-commerce website. I'm not so sure about Facebook app trying to learn as I dev. As I was wrapping up with my tracking I came across this repo. Seems I had the wrong impression about the value. How is the value determined? I assumed it would be the value of the product item.

value: value of a user performing this event to the business // cd[value]=

Does that mean setting the value as the product gross price is completely incorrect.

 fbq('track', 'InitiateCheckout', {
                                content_ids: itemIds,
                                content_type: 'product',
                                value: this.order.grossPrice,
                                num_items: itemIds.length,
                                currency: 'ZAR'
                            });

@debragail
Copy link

explain value: to me as well because I don't understand why it's implicit in the examples.

@23tux
Copy link

23tux commented Oct 2, 2018

+1, please explain why you put value: 0.10 in there. For a purchase event, the value is (IMHO) clear: the price of the product. But when something is added to the cart, or just viewed the value must be either also the product price, or something your team came up with / calculated, e.g. "putting something in the cart is worth 10 cent for our business", however you would find such values.

@kyborek
Copy link

kyborek commented Oct 30, 2018

According to https://developers.facebook.com/docs/facebook-pixel/reference/ the status variable for CompleteRegistration should be of type Boolean. This means that value 'complete' is invalid. I could not find though what is the meaning of this variable

@danielmcclure
Copy link
Author

Apologies for the delayed response, I don't seem to get notifications for these comments.

explain value: to me as well because I don't understand why it's implicit in the examples.

+1, please explain why you put value: 0.10 in there. For a purchase event, the value is (IMHO) clear: the price of the product. But when something is added to the cart, or just viewed the value must be either also the product price, or something your team came up with / calculated, e.g. "putting something in the cart is worth 10 cent for our business", however you would find such values.

10 cents was an arbitrary value for some of the above examples. You should use the value of a product or the value of a tracked action to your business. There is no way that I can provide a universal method for acquiring that value in a simple template. As an example for the CompleteRegistration event mentioned below; if you tend to earn make one sale of $1000 for every 100 people that register on your site then an average registration is worth $10 to your business when averaged out, so you can set a value of 10 to monitor your ROI, if there is no set value you can just use 0.10, 1 or any arbitrary number, or simply leave out value if it isn't required by the event type.

According to https://developers.facebook.com/docs/facebook-pixel/reference/ the status variable for CompleteRegistration should be of type Boolean. This means that value 'complete' is invalid. I could not find though what is the meaning of this variable

Boolean means that something is either true or false. Therefore the value 1 typically mean something happened or is true and 0 means something didn't happen or is false. In this case did the user successfully complete their registration? Yes = 1 and No = 0. Generally you would hope/assume that when this event is fired the result is a 1 or true.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment