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:
- Heading
- Button
- Image
- MailChimp Form
- Product List
- Product Image
- Product Title
- Product Add to cart
- Product View Details
- Collection Image
- Collection Title
- Collection View Details
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”.
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.
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
As a result you should see two pixels fired on the page load.
References
If you have any questions feel free to submit a ticket and our Customer Support team will get back to you ASAP.