Help Centre

Support > Promoting Your Website > Website Statistics

How To Setup Facebook Pixel Conversion Tracking

What is Facebook Pixel?

The Facebook Pixel gives you the ability to analyse how users interact with your website by tracking specific events on your website. This is geared towards measuring conversions and the success of your marketing. It is easily implemented by adding a small bit of code to your web page.

This guide will cover how to set up and configure the Facebook Pixel on your website.

How to get the Pixel code from Facebook

  1. Load up Facebook Manager.

  1. On the hamburger menu (from the top left hand corner select “All Tools > “ in the bottom corner to see the full options. 

  1. Select “Pixels” under the “Events Manager” heading.

Facebook Events Manager

  1. Once in the pixel's area click on the “Add New Data Source” button on the left-hand menu and choose “Facebook Pixel” in the list.

Adding Pixel as a data source

  1. Follow the onscreen setup to create your new pixel code. Enter your pixel name and the full website URL in the boxes provided as per our example below:

creating a Facebook Pixel

  1. On the next screen select “Manually install pixel code yourself”.

Choosing how to install your Facebook Pixel

  1. You’ll now see a screen with information about the code itself and you’ll need to add this to your Create account in the HTML Fragments area.

How to add the Pixel code to your website

Adding your Pixel as an HTML Fragment

  1. Log in to your Create account.

  2. Click on “Content” on the top menu.

  3. Click on “HTML Fragments” on the left-hand menu.

  4. Click on the button “Add HTML Fragment” in the top right corner.

  5. Give your HTML Fragment a description so you can reference it. For example “Facebook Pixel Code”.

  6. In the “HTML Code” box paste the code for your Facebook pixel. This is available in Step 2 of the setup screen you’re on.

  7. You’ll need to amend the code once pasted into the HTML box to include additional variables that track your completed purchase values. This is as follows and should be added after the line “<B>fbq('track', 'PageView');</b>” exactly as outlined below:

    fbq('track', 'Purchase', {
    value: cr_ordertotal,
    currency: 'GBP',

Where to place your additional code in your HTML Fragment

Please Note: If your store is in a different currency from UK pounds, you should replace GBP in your currency field, for example USD for US Dollars and EUR for Euros. (List of currency codes for reference here). 

  1. Select the option for placing the code in your “HEAD” section and press the “Add HTML Fragment” button at the bottom of the page to complete. 

  2. Finally, publish your website to update your live site.

How to test your Facebook Pixel

  1. Return to Facebook’s setup and continue with the steps. 

  1. Move down to step 4 and enter your website address as you entered it in the first setup stage and press the “Send Test Traffic” button. 

How to send test traffic to your Facebook Pixel

  1. Facebook will load up your website.  If you have completed the setup of the pixel correctly when you return to the Facebook setup screen you should see that it is now logging activity on your site as shown below and you can click the blue continue button:

Confirming the status of your Facebook Pixel

Setting Up The Conversion Tracking On Your Site

The next stage is to tell Facebook the events that are happening on your website so it can understand the checkout flow your customer will follow. To do this:

  1. Select “Use Facebook’s event setup tool” on the next screen.

Using Facebook's event setup tool

  1. On the next screen enter your website address exactly as before when you first set up and press the “Open Website” button. 

Setting up events with Facebook's Pixel

  1. Facebook will load your live website and include a box in the top-left corner where you will confirm the activities it will log. 

  1. Go to a product page on your website and the Facebook Event Setup Tool should detect the Add To Basket button on your website as a possible action to track.

Defining the "Add To Cart" Stage

  1. Select the “Review” button next to “Add To Cart” from the Facebook Event Setup Tool, then choose “Add To Cart” from the drop-down on the next screen and press “Confirm”.

Suggested events on the Facebook Pixel

  1. Next, click the “Add To Basket” button on your site to go through to the checkout. You don't need to set this button up as an event with the tool. 

  1. Highlight the “Proceed To Checkout” button and choose the Initiate Checkout event from the Facebook Event Setup Tool. You may need to edit this with the pencil next to it.

Defining the initiation of the checkout

  1. Select “Initiate Checkout” in the drop down list, then click on the Order Total amount on your website to set it as the value and enter your currency from the list. Press the “Confirm” button to complete this stage. 

Defining the value on the page

  1. Click the “Proceed To Checkout” button on your website to go through to the next stage. 

Defining the value on the order page

  1. You’ll now be on the page to complete your personal details to buy the item. Please note you’ll need to be able to place an actual order through your payment gateway and reach the Thank You screen to fully complete this setup. 

    Fill out your personal details and once the “Review Order” button becomes available, set this up as the Initiate Checkout option also and again choose the order value and currency from the Facebook Event Setup Tool.

  1. On the Review Order page, you’ll need to set up the button for making the payment. If you have multiple payment options - paypal, Create Payments, Manual payment etc you'll need to go through the setup tool for each of the buttons that take you through to pay as the wording changes and this may confuse Facebook. 

    In this example, the button says "Pay Now" but the wording on your button may be different depending on the gateway you've selected or wording you've set. 

    Choose the option “Add Payment Info” from the drop-down list for this button and press the Confirm button. Then click through on the pay now button to make payment. 

defining the payment gateways

  1. On the final thank you page you will need to specify that this URL is the completed purchase page. 

Defining the completed purchase page

  1. Select the button “Track a URL” on the Facebook Event Setup Tool. Choose "URL begins" from the drop down list as sometimes the /thankyou page will end with a ?orderid= and a number. 

  1. On the setup, select “Purchase” from the drop down and set the Value to “Don’t Include Value”, this is because this has been set in your Facebook Pixel code. Press the Confirm button to complete this step.

Track an event using a URL Dialogue

  1. Once you’ve confirmed the step to set up the purchase you should see a Facebook message to say that the Purchase is live and being tracked on your site.  Click Finish Setup on the Facebook Event Setup Tool. 

  1. Now go back to your website and complete another order. On your Facebook Pixel events page you should see your activity tracking and the information about your completed purchase, including the order totals, as seen in our example below:

Successful Facebook Pixel Tracking

NB - If you have PayPal set up as an active payment gateway on your website, you will need to ensure that 'Auto Return for Website Payments' is enabled in order for the Pixel to accurately track orders. You can see our help guide here for more information on how to set this up. 

More Questions?

If you have any further questions, please get in touch and we will be happy to help.

Get in Touch