pagefly.io
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.
You can watch this video for more details
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.
Common issues with Facebook Pixel
1. Error message: “AddToCart Event missing some deduplication parameters” or “Purchase Event missing some deduplication parameters”
This is mostly because you have not successfully set up Facebook Pixel for your store.
Solution: Please refer to 3 set up steps above to check again if you missed anything.
2. Facebook can not track purchases through Shopify Thank you page
Solution:
Step 1: Check if Facebook Pixel is completely set up in Online Store > Preferences. Refer to steps above. Next, check to make sure your Facebook Pixel tracking app is working properly.
Step 2: Check if Facebook Pixel is set up with Product Add to Cart, not the Button element.
Step 3: Check if Header and Footer is turned on.
3. Facebook is double tracking for 1 event
Reason: This is mostly because you manually added event for your PageFly page, while your Theme automatically fired event before.
Check to see if it’s a product page with PageFly.
Then, if you get the Theme from Themes Marketplace (themes.shopify.com), the reason may be that Facebook Pixel is already fired with “Add to Cart”. It leads to double tracking when you manually fired Facebook Pixel again with PageFly.
Solution: Assign to None for your element you fired manually with PageFly. For example:
4. Facebook tracking suddenly turned off
Reason: Set up Facebook Pixel NOT in Online Store, but with manual code injection or within theme.liquid file.
Solution:
Check again the manual code or theme.liquid file. Try to delete the manual code or restore Older versions of Theme.liquid file > set up Facebook Pixel in Online Store > Preferences instead.
You may want to know how to Restore Older Versions of Theme.liquid file:
5. For other problems that not listed above, the suggested solution is that please ensure you are ONLY firing Facebook Pixel properly by Online Store -> Preferences, NOT by any other ways. Then check to make sure the Facebook Pixel tracking app is working.
References
If you have any questions feel free to submit a ticket and our Customer Support team will get back to you ASAP.
Previous article