Setup Facebook Pixel with Full Events for Ecommerce Without Plugin [Comprehensive Guide]

This guide provides a detailed, step-by-step walkthrough for setting up Facebook Pixel with full event tracking for your ecommerce website—without using any plugins. Whether you’re running ads on Facebook, Instagram, or other Meta platforms, this setup enables you to track user interactions, optimize your ad spend, and build effective remarketing campaigns. Read on for the complete guide, including useful tips and troubleshooting advice.

Introduction to Facebook Pixel and Its Benefits

What is Facebook Pixel?
Facebook Pixel is a snippet of JavaScript code that you add to your website. It helps you measure, optimize, and build audiences for your ad campaigns by tracking the actions visitors take on your site. This data is invaluable for:

• Conversion Tracking: Understand which actions (like purchases or sign-ups) result from your ads.
• Remarketing: Re-engage visitors who have shown interest in your products.
• Audience Building: Create custom audiences based on website behavior.
• Optimizing Ads: Adjust your ad strategies to target the most valuable segments of your audience.

Using Facebook Pixel is especially critical if you run ads on Meta platforms such as Facebook and Instagram, as it allows you to attribute conversions accurately and improve your overall ad performance.

Step 1: Create a Facebook Pixel

Access the Facebook Pixel Panel:

1. Navigate to the new Facebook Pixel panel at Facebook Pixel Creation.
2. Click on the Connect Data button.
3. Select “Web” as your data source.

Step 2: Add the Pixel to Your Website

After creating your Pixel, you need to integrate it with your website. There are two primary options available:

Option 1: Copy “Dataset ID”

Find the Dataset ID:

1. Go to Facebook Events Manager > Data Sources > Settings.
2. Copy the Dataset ID provided.

Paste the Dataset ID in Your Shop Dashboard:

• Log in to your Selldone Shop Dashboard.
• Navigate to Channels > Facebook.
• Paste the Dataset ID into the Pixel ID field and click Save.

Option 2: Paste Raw HTML Code or Use Cloudflare Zaraz

• Raw HTML Code Integration: You can also paste the raw HTML code provided by Facebook directly into your website’s header.
• Using Cloudflare Zaraz: For an alternative, consider using Cloudflare Zaraz. This tool not only helps in setting up your Pixel but also enhances server-side tracking. For detailed instructions, refer to this guide:How to Monitor Your Ecommerce Performance with Cloudflare-Zaraz (And Why We Use Server-Side Analytics)

Step 3: Complete the Pixel Setup

Gather Website Events from Browser Activity

Method:
Use the “Gather website events from browser activity” option. This method sends events from the client’s browser rather than the server, helping to comply with privacy regulations.

⚡ Important Consideration:
Most browsers block Facebook events by default. To overcome this, you can use Cloudflare Zaraz to gather and send events server-side while also managing cookie consent and privacy policies. More details are available in the Zaraz guide:Cloudflare Zaraz for Ecommerce Tracking

Setup Pixel | Install Base Code

Installation:
You will receive an HTML code snippet to place in your website’s header.

Note: If you have already set your Pixel ID in your Selldone Shop, you do not need to add this base code. However, if you wish to install it manually, refer to the detailed instructions in the Zaraz guide.

Setup Pixel | Automatic Advanced Matching

Advanced Matching:
This feature lets you use customer information (like email addresses or phone numbers) already provided to your business. Facebook hashes this data and matches it with its users, enhancing conversion attribution and remarketing capabilities.

Configuration:
Select the information you wish to collect. This data is not sent by default to protect privacy—enable only what is necessary for your tracking and marketing needs.

Setup Pixel | Add Event Code

• Event Tracking: You typically do not need to add any custom event code, as Selldone Shop pre-defines standard and professional ecommerce events. However, if desired, you can manually enter your page addresses, select elements, and define new events.
• Pre-Defined Events: These are automatically set up in Selldone Shop:

Extra Pre-Defined Events by Selldone:

• ♾ ProductImpressions: Measures product impressions by pushing the product list details.
• ♾ RemoveFromCart: Measures the removal of a product from the shopping cart.
• ♾ ViewCart: Represents Step 1 in the checkout process.
• ♾ InitiateCheckout: Represents Step 2 of the checkout process.
• ♾ AddPaymentInfo: Represents Step 3 of the checkout process.

Debugging and Testing Your Facebook Pixel

Debug Events in Your Live Store

Enable Debug Mode:

1. On your website, press Ctrl + D to bring up the debug menu.
2. Select “Log Analytics and Events”.

View Console Logs:

1. Press F12 to open your browser’s developer console.
2. Navigate to a product page and click Add to Cart.
   You should see logs for both GTAG and Facebook Pixel events.

Test Facebook Events

• Testing Setup: Go to Facebook > Data Sources > Test Events tab.
• Verification: Click “Confirm your website’s events are set up correctly” to test and verify event tracking.

Common Issues and Troubleshooting

Events Not Being Sent

• Possible Causes:
• Browser or plugin-based blocking of Facebook tracking scripts.
• Facebook rejecting the script load on your site.
• Solution:
  Whitelist your domain to ensure Facebook Pixel can load properly.

Whitelisting Your Domain in Facebook

Access Domain Settings:

1. Go to the Facebook Event Manager: Facebook Event Manager.
2. Navigate to Data Sources > Settings.
3. Scroll down to “Traffic Permissions – Websites”.

Create an Allow List:

1. Click on Create Allow List.
2. Once completed, your domain will appear in the allow list.

Now you can see the domain in the allow list:

🚧 Additional Note:
Ensure you disable any tracking blockers (e.g., Firefox’s tracking protection) that might prevent the script from running.

Browser Considerations

Script Loading Issues:

If the Facebook script does not load, you may need to adjust browser settings or try a different browser.

Recommendation:

Use Chrome for testing the Facebook Pixel setup, as it tends to have fewer issues with script blocking.
As demonstrated, when the Pixel is set up correctly, events are successfully sent to Facebook:

Dashboard Confirmation:
Your Facebook dashboard will display the received events if everything is functioning properly.

Ready To Run Facebook Ads

Setting up Facebook Pixel with full event tracking is crucial for any ecommerce business leveraging Meta’s advertising platforms. This guide covered everything from creating the Pixel and adding it to your website, to configuring advanced matching and troubleshooting common issues. By following these steps, you can ensure accurate data collection and improved ad performance, ultimately helping you better understand your customers and drive more conversions.

Remember, staying compliant with privacy regulations while collecting valuable data is key—so adjust your settings based on your business needs and user consent requirements. Happy tracking!