Meta Pixel Setup on Wix | Blue Frog Docs

Meta Pixel Setup on Wix

Complete guide to installing and configuring Meta Pixel (Facebook Pixel) on Wix websites.

Meta Pixel Setup on Wix

This guide covers three methods for implementing Meta Pixel (formerly Facebook Pixel) on Wix websites, with recommendations based on your tracking requirements and technical capabilities.

Prerequisites

Before beginning:

  • Create a Meta Pixel in Facebook Business Manager
  • Obtain your Pixel ID (15-16 digit number)
  • Determine which events you need to track
  • Understand Wix's SPA (Single-Page Application) behavior

Method 1: Wix Marketing Integrations (Easiest)

The simplest method with automatic setup, suitable for basic tracking.

Step-by-Step Installation

  1. Access Marketing Integrations

    • Wix DashboardMarketing & SEOMarketing Integrations
  2. Find Meta Pixel

    • Scroll or search for Facebook Pixel or Meta Pixel
    • Click Connect
  3. Enter Pixel ID

    • Paste your Pixel ID (numbers only, e.g., 123456789012345)
    • Click Connect or Save
  4. Publish Your Site

    • Changes take effect only after publishing
  5. Verify Installation

    • Install Meta Pixel Helper Chrome extension
    • Visit your live Wix site
    • Check that pixel fires in extension popup

What Gets Tracked Automatically

With native integration:

Event Tracked? Trigger
PageView ✅ Yes Every page load
ViewContent ⚠️ Limited Product pages (if Wix Stores enabled)
AddToCart ⚠️ Limited Wix Stores add to cart
InitiateCheckout ⚠️ Limited Wix Stores checkout
Purchase ⚠️ Limited Wix Stores purchase completion
Custom events ❌ No Not supported
Advanced matching ❌ No Not supported
CAPI integration ❌ No Not supported

Limitations of Native Integration

  • No custom events (e.g., lead forms, video views)
  • No event parameters customization
  • No advanced matching (for better attribution)
  • Limited ecommerce data (product details often missing)
  • Cannot use Conversions API (CAPI)
  • No control over pixel configuration

For advanced tracking, use Method 2 or 3.

Method 2: Custom Code Installation

Provides full control over Meta Pixel configuration and events.

Step 1: Add Pixel Base Code

  1. Wix DashboardSettingsCustom Code
  2. Click + Add Custom Code
  3. Name: "Meta Pixel - Base Code"
  4. Paste the following:
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');

fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');
</script>
<noscript>
  <img height="1" width="1" style="display:none"
    src="https://www.facebook.com/tr?id=YOUR_PIXEL_ID&ev=PageView&noscript=1"/>
</noscript>
<!-- End Meta Pixel Code -->
  1. Replace YOUR_PIXEL_ID with your actual Pixel ID

  2. Configure:

    • Load code on: All pages
    • Place code in: Head
    • Load code once: ✅ Checked
  3. Click Apply and Publish your site

Step 2: Enable Advanced Matching (Optional)

For better attribution, enable advanced matching if you have user data:

<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');

// Advanced Matching (hash email if available)
fbq('init', 'YOUR_PIXEL_ID', {
  em: getUserEmail(), // Must be hashed
  external_id: getUserId() // Optional
});

fbq('track', 'PageView');

// Helper function to get hashed email
function getUserEmail() {
  // Only if user is logged in via Wix Members
  // Must implement email hashing (SHA-256)
  // See Velo implementation below
  return null;
}

function getUserId() {
  // Wix member ID if logged in
  return null;
}
</script>

⚠️ Important: User data must be hashed before sending. See event tracking guide for implementation.

Step 3: Handle Wix SPA Navigation

Wix uses AJAX navigation, which means pageviews may be missed. Add this Velo code:

// File: Site Code (Global)
import wixLocation from 'wix-location';

let lastPath = wixLocation.path.join('/');

wixLocation.onChange(() => {
  const currentPath = wixLocation.path.join('/');

  if (currentPath !== lastPath) {
    lastPath = currentPath;

    // Fire virtual pageview
    if (window.fbq) {
      fbq('track', 'PageView');
    }
  }
});

Best for managing Meta Pixel alongside other marketing tags.

Prerequisites

Step 1: Create Meta Pixel Tag in GTM

  1. GTMTagsNew
  2. Tag ConfigurationCustom HTML
  3. Name: "Meta Pixel - Base Code"
  4. Paste:
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');

fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');
</script>
  1. Triggering: All Pages
  2. Save and Preview before publishing

Step 2: Create Virtual Pageview Tag

For SPA navigation:

  1. Tag ConfigurationCustom HTML
  2. Name: "Meta Pixel - Virtual Pageview"
  3. Code:
<script>
if (window.fbq) {
  fbq('track', 'PageView');
}
</script>
  1. Triggering: Custom Event → wix.page.navigation (See GTM setup guide for creating this trigger)

For GDPR/CCPA compliance, implement consent handling:

<script>
// Check if user has consented to marketing cookies
if (hasMarketingConsent()) {
  fbq('init', 'YOUR_PIXEL_ID');
  fbq('track', 'PageView');
}

function hasMarketingConsent() {
  // Implement based on your consent mechanism
  // Example: Check cookie or localStorage
  return localStorage.getItem('marketing_consent') === 'granted';
}
</script>

Option 2: Meta Limited Data Use (LDU)

For CCPA compliance:

<script>
// Enable Limited Data Use for California users
if (isCaliforniaUser()) {
  fbq('dataProcessingOptions', ['LDU'], 1, 1000);
}

fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');

function isCaliforniaUser() {
  // Implement geolocation or user selection logic
  return false;
}
</script>

If using GTM, implement Google Consent Mode:

// In GTM tag
if (window.google_tag_manager &&
    window.google_tag_manager.dataLayer &&
    window.google_tag_manager.dataLayer.get('ads_storage') === 'granted') {
  fbq('init', 'YOUR_PIXEL_ID');
  fbq('track', 'PageView');
}

Wix-Specific Considerations

Wix Editor vs Wix Studio

Feature Wix Editor Wix Studio
Native integration ✅ Yes ✅ Yes
Custom code ⚠️ Premium plans only ✅ Yes
Velo support ⚠️ Requires enabling ✅ Built-in
Advanced tracking ⚠️ Limited ✅ Full access

Wix Stores Integration

If you have Wix Stores:

  • Product pages get automatic ViewContent events (native integration)
  • Add to cart triggers AddToCart (limited data)
  • Checkout triggers InitiateCheckout
  • Purchase triggers Purchase event

For full ecommerce tracking with product details, see event tracking guide.

Wix Turbo Compatibility

Meta Pixel works with Wix Turbo (performance optimization), but:

  • Test thoroughly after enabling Turbo
  • Verify pixel still fires on all pages
  • Check for timing issues with custom events

Verification and Testing

1. Meta Pixel Helper (Chrome Extension)

  1. Install Meta Pixel Helper
  2. Visit your Wix site
  3. Click extension icon
  4. Verify:
    • ✅ Pixel found
    • ✅ PageView event fires
    • ✅ No errors shown

2. Meta Events Manager

  1. Go to Facebook Events Manager
  2. Select your Pixel
  3. Click Test Events
  4. Enter your website URL
  5. Navigate your site and verify events appear

3. Browser Developer Tools

  1. Open DevTools (F12)
  2. Network tab
  3. Filter: facebook.com/tr
  4. Look for requests with:
    • id=YOUR_PIXEL_ID
    • ev=PageView
    • Status code: 200

4. Data Sources in Events Manager

Check Overview tab in Events Manager:

  • Events Received should show recent activity
  • Active Sources should show "Active" status
  • Check for any errors or warnings

Common Setup Issues

Issue Cause Solution
Pixel not detected Code not published Publish Wix site after adding code
Pixel fires twice Multiple installations Use ONLY one method (native OR custom code OR GTM)
PageView not firing on navigation SPA not handled Implement Velo tracking or GTM virtual pageviews
"No pixel found" in Helper Ad blocker active Test in incognito without extensions
Events delayed Network latency Normal - check Events Manager after 5-10 minutes
Pixel ID error Incorrect ID format Use only numbers (e.g., 123456789012345)

Multiple Pixels (Multi-Account)

To track with multiple pixels (e.g., client + agency):

<script>
fbq('init', 'PIXEL_ID_1'); // Primary pixel
fbq('init', 'PIXEL_ID_2'); // Secondary pixel

// This tracks to both
fbq('track', 'PageView');
</script>

Or track to specific pixel:

<script>
fbq('init', 'PIXEL_ID_1');
fbq('init', 'PIXEL_ID_2');

// Track PageView to both
fbq('track', 'PageView');

// Track custom event to only pixel 1
fbq('trackSingle', 'PIXEL_ID_1', 'CustomEvent');
</script>

Pixel Configuration Options

Automatic Configuration

Meta Pixel can automatically track some events. Control this:

// Disable automatic configuration
fbq('init', 'YOUR_PIXEL_ID', {}, {
  autoConfig: false
});

Disable Auto-Tracking

Prevent automatic event tracking:

fbq('init', 'YOUR_PIXEL_ID', {}, {
  autoConfig: false,
  debug: false // Set true for debugging
});

Enable Debug Mode

For troubleshooting:

fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');

// Enable debug logging
window._fbq.set('debug', true);

Performance Optimization

Lazy Load Meta Pixel

For performance-sensitive sites, delay pixel load:

<script>
// Load pixel after page interactive
window.addEventListener('load', function() {
  setTimeout(function() {
    // Insert Meta Pixel code here
    !function(f,b,e,v,n,t,s){...}
    fbq('init', 'YOUR_PIXEL_ID');
    fbq('track', 'PageView');
  }, 1000); // 1 second delay
});
</script>

Trade-off: May miss some quick bounces, but improves Core Web Vitals.

Defer Pixel Script

<script defer src="https://connect.facebook.net/en_US/fbevents.js"></script>
<script>
window.fbq = window.fbq || function() {
  window.fbq.queue = window.fbq.queue || [];
  window.fbq.queue.push(arguments);
};
</script>
<script>
fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');
</script>

Best Practices

  1. Use only ONE installation method to avoid duplicate events
  2. Test in incognito mode to avoid ad blocker interference
  3. Document your implementation for team members
  4. Monitor Events Manager regularly for errors
  5. Implement consent handling for privacy compliance
  6. Use descriptive event names for custom events
  7. Test before publishing using Preview mode
  8. Set up CAPI for improved data reliability (see next guide)

Wix Plan Requirements

Feature Wix Plan Required
Native Integration All plans
Custom Code Premium plans or higher
Velo (for advanced tracking) Premium + Velo enabled
Wix Stores events Business & eCommerce plans

Next Steps

Additional Resources

// SYS.FOOTER