Build Custom Audiences

Custom Audiences from your website allows you to target your Facebook ads to audiences of people who have visited your website and remarket to people who show an interest in your products.

What Data is required to Pass to the Pixel

For Dynamic Product Ads, you need to pass three specific events: ViewContent, AddToCart, and Purchase. You can find more information about these events and examples in the Dynamic Ads Implementation Guide

If you're not using Dynamic Product Ads, you need to modify the pixel only if your marketing needs require more data than the URL can provide to match your desired audience segment. For example, to create an audience of anyone who makes a search for the words "cargo lines". The search results page on your website can have the following URL:

http://example.com/searchresults?q=custom+cargo+liner

In this case, the pixel that you placed on the search results page will automatically capture this URL. You can later create an audience segment where the URL contains "cargo liner" and target that audience with ads about cargo liners. As long as your website captures the search term somewhere in the URL, you can do the same.

Similarly, if a person browses a certain product category on your website they may land on a page whose URL looks like this:

http://example.com/catalog/pdp.html?catId=cat18501

Again, the pixel on the category page automatically captures the above URL, including the catId parameter. You can then create an audience segment where the URL contains cat18501 and target that audience with ads about that category.

Here are the commonly used actions along with some parameters:

Audience Segment Data Typically Used For Segmentation (from page URL)

All potential customers

Your page URL

People who searched for a product on your website

Search terms and other search parameters e.g. dates, colors, sizes, styles, country, destination id

People who viewed a specific product or category.

Product id, product category, product variations e.g. dates, color, size, style, country, destination id. See ViewContent event.

People who started purchasing.

Cart value, products in cart (product id, product category, product variations e.g. dates, color, size, style, country, destination id.) See AddToCart event.

People who completed purchasing.

Order value, products purchased (product id, product category, product variations e.g. dates, color, size, style, country, destination id. See Purchase event.

People who were referred from a paid search engine result.

Search string, search campaign, search source.

People interested in clearance/deals.

Product id, product category, sale expiration date, product variations e.g. dates, color, size, style, country, destination id.


With the Facebook pixel, there are 9 predefined standard events that you can place across websites, such as the ones used in Dynamic Product Ads: ViewContent, AddToCart, Purchase, and many more. When you place these standard events on your website, they' a're also eligible conversion reporting and optimization. Learn more about standard events and the suggested parameters.

Sending custom data

In some cases you may want to segment your audiences using data that is not available in the page URL. To do so you will need to make changes to the pixel code.

If the data you want to segment by is known on the server side when the page is being sent to the browser, you can use server-side code to explicitly set the event name and parameters on the pixel as it is being added to the page.

For example adding a custom destination parameter to the pixel fire:

<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', '<FB_PIXEL_ID>');
fbq('track', 'PageView');

// this line of JS code can be populated by server-side
// code that has the data needed to segment your audience
fbq('track', 'InitiateCheckout', { 
    destination: 'nyc'
});
</script>

<noscript>
<img height="1" width="1" border="0" alt="" style="display:none" 
src="https://www.facebook.com/tr?id=<FB_PIXEL_ID>&amp;ev=InitiateCheckout&amp;cd[destination]=nyc" />
</noscript>

If however the data is only known on the client side, you can write some JS code to dynamically trigger pixel events by using the Facebook Tag API.

Another example pixel implementation sending over a larger set of custom data with the ViewContent event:

<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', '<FB_PIXEL_ID>');
fbq('track', 'PageView');

fbq('track', 'ViewContent', { 
    content_type: 'product',
    content_ids: ['1234'],
    content_name: 'ABC Leather Sandal',
    content_category: 'Shoes',
    value: 0.50,
    currency: 'USD'
});
</script>

<noscript>
<img height="1" width="1" border="0" alt="" style="display:none" 
src="https://www.facebook.com/tr?id=<FB_PIXEL_ID>&amp;ev=ViewContent&amp;cd[content_type]=product&amp;
cd[content_ids]=1234&amp;cd[content_name]=ABC%20Leather%20Sandal&amp;cd[content_category]=Shoes&amp;
cd[value]=0.50&amp;cd[currency]=USD" />
</noscript>

How to Place the Pixel

The pixel is a small snippet of JavaScript (JS) code that runs whenever someone opens a page with it installed. The code is loaded asynchronously.

For best results, we recommend placing the pixel directly into the HTML of the page, immediately before the </head> tag.

  • Placing the code directly in the page, rather than a tag manager or in an iframe reduces the chances of the browser or third-party code blocking the JS from executing.
  • Placing the code within the <head> section of HTML allows the code to execute sooner, and increases the chances of the person navigating the page to be captured in an audience before they close the page.

Using the IMG tag

The pixel can also be used as an <img> tag. We discourage advertisers from using only the image tag because some functionality may be lost. However, there may be some use cases where a light weight implementation is required. In this case, you can use the <img> tag between the <noscript> portion of the JS tag to collect a website Custom Audience.

For example,

<img src="https://www.facebook.com/tr?id=<FB_PIXEL_ID>&amp;ev=PageView" height="1" width="1" style="display:none"/>

Sending parameters using img pixel:

<img src="https://www.facebook.com/tr?id=<FB_PIXEL_ID>&amp;ev=ViewContent&amp;cd[content_name]=ABC%20Leather%20Sandal&amp;cd[content_category]=Shoes&amp;cd[content_type]=product&amp;cd[content_ids]=1234&amp;cd[value]=0.50&amp;cd[currency]=USD" height="1" width="1" style="display:none"/>

The following features are supported by the JS version of the pixel and not by the IMG version of the pixel:

  • JS pixel can be fired multiple times on each page load.
  • JS pixel can be used to control when an event should be fired (i.e., upon a button click).
  • JS pixel is not subject to HTTP GET limit in sending custom data or long URLs.
  • JS pixel is being loaded asynchronously VS. the image pixel which is being loaded as an image, synchronously.

Tag Managers

In some cases, advertisers choose to use a tag manager to make it easier to manage multiple pixels and other JS code. Although we recommend adding the the pixel directly into the HTML it is possible to "piggyback" the pixel on another tag. The pixel should work in most tag management and tag container solutions. For specific advice on implementing website Custom Audiences with your tag manager please consult your tag manager's documentation.

Mobile Websites

Everything we discussed thus far applies to mobile and desktop websites. If your mobile website is separate from your desktop website, you should also consider adding the pixel to it. Adding the pixel to your mobile website allows you to segment people who visit your mobile website, remarket to those audience segments, exclude or create lookalikes.

Audience Source vs. Ad Placement

The audience segments you create can have people who visited your desktop website or mobile website or both. You can then remarket to those audiences with ads placed on Facebook's desktop website, Facebook's mobile website and/or Facebook's iOS and Android apps. The placement of those ads is completely independent of the source of the audience. In fact it's pretty common to capture people who visit your mobile website and retarget them with ads on Facebook's desktop website to get them to convert via your desktop website (conversion rates tend to be higher for desktop compared to mobile websites). Similarly, you can target people who visit your desktop website and show them ads in Facebook's mobile app to get them to install your mobile app. So don't confuse where people visit your website with where you place an ad to remarket to them.