Set up Facebook Pixel to my page

In this article, you will learn how to set up a Facebook event Pixel on your PageFly page. If you have successfully set up Facebook Pixel on your Facebook account, skip to Step 2.

But first of all, you need to know the main function of the Facebook Pixel.

As defined on the Facebook Business help, Facebook Pixel is an analytics tool that allows you to measure the effectiveness of your advertising by understanding the actions people take on your website.

You can read more here

Step 1: Set up Facebook Pixel

First, visit the Facebook Events Manager page to set up an account and get a unique Pixel ID. Follow the instructions as you get started.

Connect Website Activity Using Pixel to connect to your Shopify store as per the image below.

Then choose Shopify as a Partner.

Complete 4 steps to successfully connect the Facebook pixel to your Shopify account.

When you finish setting up it will show like this.

Step 2: Install Facebook pixel to your store

Make sure you’re in the Events Manager page. Copy the unique pixel ID under your account’s name.

Go back to your Shopify Admin.

Visit Online store > Preferences > paste the pixel ID into the Facebook Pixel section > hit Save.

Open the page that you want to set up the Facebook pixel into.

Event tracking for Facebook Pixel is available in 12 elements:

  1. Heading
  2. Button
  3. Image
  4. MailChimp Form
  5. Product List
  6. Product Image
  7. Product Title
  8. Product Add to cart
  9. Product View Details
  10. Collection Image
  11. Collection Title
  12. Collection View Details

facebook pixel 4

Select the suitable Facebook pixel event for your purpose. The event types that can be collected are:

  • Search
  • View Content
  • Add To Cart
  • Add To Wishlist
  • Initiate Checkout
  • Add Payment Info
  • Purchase
  • Lead
  • Complete Registration
  • Custom Event

Once you choose an event type, the event code will be generated automatically.

To check the performance of the pixel, you can install the Pixel Helper Google Chrome extension. If the pixel works smoothly, you would see this when clicking on the extension icon on the live page.

Step 3: Check Facebook event tracking

To check Facebook event tracking, go to your Facebook Events Manager Page > select the menu on the top left corner > choose Ads Manager.

Go to Ad Sets tab > choose Columns: Performance drop-down > select Customize Columns.

Switch your view to Conversions > scroll down to select the type of pixel that you are using > hit Apply.

Select the menu again > choose Events Manager. You should see the result of your pixel fired as below.

Best Practices using Facebook & PageFly

Below you’ll find the most frequently asked questions related to setting up Facebook pixel and pages built with PageFly app.

How to fire a specific Facebook event when PageFly page is loaded?

Step 1 – Open the Custom settings inside PageFly editor.

Step 2 – Insert the code below to CUSTOM JAVASCRIPT settings.

https://pastebin.com/raw/pHs6Hy1d

Step 3 – Click “Save change” button and Publish the page

Step 4 – Check the result with Facebook Pixel Helper

Advanced Tips

If you want to send additional objectives to the Facebook event, for example, “content_name” and “content_type” please use the following code:

https://pastebin.com/raw/F9BQYpMQ

Important: Please keep in mind for the specific Facebook Event you can assign pre-designed objectives. Please refer to the Facebook Help doc. For example, Facebook ViewContent supports the following objectives: content_ids, content_category, content_name, content_type, contents, currency, value.

Check the result with Facebook Pixel Helper. As you can see there are custom parameters sent including content_type and content_name.

How to fire the Facebook Pixel when the user scrolled a specific section?

Step 1 – Name your section.

In our example, it’s “countdown”.

facebook pixel 3

Step 2 – Add custom Javascript code.

Two things you need to pay attention to.

Firstly, the jQuery function trigger the section ID with the name “countdown”.

Secondly, for our example, we send Facebook Pixel “ViewContent” without any objects.

https://pastebin.com/raw/GaSA1sKF

Step 3 – Check the result

As you can see the section that we assigned a unique ID is called “countdown”, and after scrolling that part the Facebook pixel has been fired.

facebook pixel 2

How to fire multiple Facebook Pixels on the same page?

Inside the Customer Javascript settings please include code below:

Please keep in mind to replace “YOUR PIXEL ID” with your unique ID number.

https://pastebin.com/raw/dbZ6ATbm

facebook pixel 1
As a result you should see two pixels fired on the page load.

facebook pixel pagefly

References

If you have any questions feel free to submit a ticket and our Customer Support team will get back to you ASAP.

Was this helpful?

Try out all PageFly features with Free plan

.myshopify.com
Don’t have Shopify store yet? Create store
×