How to Fix Ecwid Tracking Events Not Firing | OpsBlu Docs

How to Fix Ecwid Tracking Events Not Firing

Fix GA4, GTM, and pixel events not firing on Ecwid — embedded widget event listeners, cart popup tracking, and host site JavaScript conflict debugging

Common causes and solutions for tracking events that don't fire correctly on Ecwid stores.

For general tracking troubleshooting, see the global tracking troubleshooting guide.

Quick Diagnosis Checklist

Before diving deep, check these common issues:

  • Ad blocker disabled (for testing)
  • Incognito/private mode (clear cache)
  • Browser console has no errors (F12)
  • Ecwid API loaded (typeof Ecwid !== 'undefined')
  • Correct tracking ID (GA4: G-XXXXXXXXXX, Meta: 16 digits, GTM: GTM-XXXXXXX)
  • Code in correct location (Custom JavaScript Code section)
  • GTM container published (if using GTM)
  • Host platform not interfering (check for conflicts)

Ecwid-Specific Tracking Challenges

Widget Architecture

Ecwid is an embedded widget, not a standalone platform:

Key differences from traditional platforms:

  • Widget loads AFTER host page
  • Events triggered via JavaScript API, not page loads
  • Must wait for Ecwid.OnAPILoaded
  • Different pages are widget states, not URL changes

Common Misconceptions

"My tracking works on host page but not in Ecwid widget"

  • Host platform tracking doesn't automatically extend to widget
  • Must implement separate tracking for Ecwid events

"Events don't fire when navigating products"

  • Ecwid uses AJAX navigation (no page reloads)
  • Must use Ecwid API callbacks, not pageview tracking

Ecwid JavaScript API Issues

1. API Not Loaded

Most common issue: Code runs before Ecwid API is available.

Diagnosis

// In browser console
console.log(typeof Ecwid);

Expected: "object" If: "undefined" → API not loaded

Cause

  • Ecwid script hasn't loaded yet
  • Code runs before Ecwid initializes
  • Ecwid script blocked or failed to load

Fix

Always wrap tracking code in Ecwid.OnAPILoaded.add():

// Wrong - may run before Ecwid loads
Ecwid.OnPageLoad.add(function(page) {
  // Won't work if Ecwid isn't ready
});

// Correct - waits for Ecwid
Ecwid.OnAPILoaded.add(function() {
  console.log('Ecwid ready');

  Ecwid.OnPageLoad.add(function(page) {
    // Guaranteed to work
  });
});

2. Event Listeners Not Attached

Diagnosis

// Check if listeners are attached
Ecwid.OnAPILoaded.add(function() {
  console.log('API loaded');

  Ecwid.OnPageLoad.add(function(page) {
    console.log('Page loaded:', page.type);
  });

  Ecwid.OnCartChanged.add(function(cart) {
    console.log('Cart changed:', cart);
  });

  Ecwid.OnOrderPlaced.add(function(order) {
    console.log('Order placed:', order);
  });
});

Navigate through store and check console for logs.

If no logs appear: Event listeners not attached correctly.

Fix

Ensure listeners are inside Ecwid.OnAPILoaded.add():

<script>
Ecwid.OnAPILoaded.add(function() {
  // All event listeners HERE

  Ecwid.OnPageLoad.add(function(page) {
    // Page tracking
  });

  Ecwid.OnCartChanged.add(function(cart) {
    // Cart tracking
  });

  Ecwid.OnOrderPlaced.add(function(order) {
    // Purchase tracking
  });
});
</script>

3. Code in Wrong Location

Where Code Should Be

Ecwid Control Panel → Settings → General → Tracking & Analytics → Custom JavaScript Code

NOT:

  • Host page <head> (unless GTM)
  • WordPress theme files
  • Wix custom code section (use Ecwid's section)

Verification

  1. Go to Custom JavaScript Code section
  2. Verify code is saved
  3. Check code appears in page source:
    • View page source (Ctrl+U)
    • Search for your tracking code
    • Should appear in Ecwid widget HTML

Google Analytics 4 (GA4) Issues

GA4 Events Not Appearing

1. Verify GA4 Script Loaded

// In console
console.log(window.gtag);
console.log(window.dataLayer);

Expected: Functions/arrays If undefined: GA4 not loaded

2. Check Measurement ID

Format: Must start with G- (e.g., G-XXXXXXXXXX)

NOT:

3. Enable Debug Mode

gtag('config', 'G-XXXXXXXXXX', {
  'debug_mode': true
});

Check GA4 DebugView:

  1. GA4 → Admin → DebugView
  2. Navigate your store
  3. Events should appear in real-time

4. Verify Event Structure

// Correct format
gtag('event', 'view_item', {
  currency: 'USD',
  value: 29.99,
  items: [{
    item_id: '123',
    item_name: 'Product Name',
    price: 29.99,
    quantity: 1
  }]
});

// Common mistakes
gtag('event', 'view_item', {
  value: '$29.99',        // Should be number, not string
  items: '123'            // Should be array, not string
});

Common GA4 Mistakes

Missing currency:

// Wrong
gtag('event', 'purchase', {
  value: 100
});

// Correct
gtag('event', 'purchase', {
  value: 100,
  currency: 'USD'
});

Item IDs not strings:

// Wrong
items: [{ item_id: 123 }]

// Correct
items: [{ item_id: '123' }]

No items array:

// Wrong
gtag('event', 'add_to_cart', {
  product_id: '123'
});

// Correct
gtag('event', 'add_to_cart', {
  items: [{ item_id: '123', item_name: 'Product' }]
});

Meta Pixel Issues

Meta Pixel Not Loading

1. Verify Pixel Script

// In console
console.log(window.fbq);
console.log(window._fbq);

Expected: Functions If undefined: Pixel not loaded

2. Check Pixel ID

Format: 16-digit number (e.g., 1234567890123456)

NOT:

  • Facebook Page ID
  • Business Manager ID
  • Ad Account ID

Verify in Meta Events Manager:

  1. Go to business.facebook.com/events_manager
  2. Select your pixel
  3. Copy Pixel ID from top of page

3. Use Meta Pixel Helper

Install Meta Pixel Helper extension:

Icon colors:

  • Green: Working correctly
  • Yellow: Warnings (usually okay)
  • Red: Errors - fix required
  • No icon: Pixel not loaded

Click icon to see:

  • Events fired
  • Parameters sent
  • Errors/warnings

4. Test Events

Meta Events Manager → Test Events:

  1. Enter your store URL
  2. Click Test
  3. Navigate your store
  4. Events should appear within seconds

Meta Pixel Events Missing Parameters

Issue: Events fire but no content_ids, value, etc.

Common causes:

1. Wrong data format:

// Wrong
fbq('track', 'AddToCart', {
  content_ids: 123,           // Should be array of strings
  value: '$29.99'            // Should be number
});

// Correct
fbq('track', 'AddToCart', {
  content_ids: ['123'],
  value: 29.99,
  currency: 'USD'
});

2. Missing required fields:

// Correct format
fbq('track', 'Purchase', {
  content_ids: ['123', '456'],
  contents: [
    {id: '123', quantity: 1},
    {id: '456', quantity: 2}
  ],
  content_type: 'product',
  value: 89.97,
  currency: 'USD',
  num_items: 3
});

Google Tag Manager (GTM) Issues

GTM Container Not Loading

1. Verify GTM Installation

// In console
console.log(window.google_tag_manager);

Expected: Object with your container ID If undefined: GTM not loaded

Check page source:

  • View source (Ctrl+U)
  • Search for GTM-
  • Should find your container ID

2. Container Not Published

Most common GTM issue: Changes made but not published.

Fix:

  1. Go to GTM
  2. Look for "Workspace Changes" banner
  3. Click Submit
  4. Add version name/description
  5. Click Publish

Verify:

  • Refresh store
  • Check GTM Preview mode shows published version

3. Wrong Container ID

Format: GTM-XXXXXXX (7 alphanumeric characters)

Verify:

  1. GTM → Container details (top left)
  2. Copy exact Container ID
  3. Update in Ecwid Custom JavaScript Code

GTM Tags Not Firing

1. Use Preview Mode

In GTM:

  1. Click Preview (top right)
  2. Enter your store URL
  3. Click Connect

Tag Assistant opens:

  • Shows all events
  • Which tags fired
  • Which didn't and why

2. Check Triggers

Common issues:

Event name mismatch:

Trigger: product_viewed
Data Layer: productViewed  // Case mismatch

Fix: Event names must match exactly (case-sensitive).

Trigger conditions wrong:

  • Check all conditions
  • Use Preview mode to verify data layer values

3. Check Variables

In Preview mode:

  1. Click event
  2. Go to Variables tab
  3. Check if variables populate

If undefined:

  • Data layer path wrong
  • Event hasn't fired yet
  • Data doesn't exist

Example fix:

// Wrong path
ecommerce.products.0.id

// Correct for Ecwid
ecommerce.detail.products.0.id

GTM Data Layer Not Populating

Issue: Ecwid events don't push to data layer.

Cause

Ecwid doesn't push to data layer by default - you must implement it.

Fix

Add data layer implementation to Custom JavaScript Code:

window.dataLayer = window.dataLayer || [];

Ecwid.OnAPILoaded.add(function() {

  // Product viewed
  Ecwid.OnPageLoad.add(function(page) {
    if (page.type === 'PRODUCT') {
      Ecwid.getProduct(page.productId, function(product) {
        dataLayer.push({
          'event': 'product_viewed',
          'ecommerce': {
            'detail': {
              'products': [{
                'id': product.id.toString(),
                'name': product.name,
                'price': product.defaultDisplayedPrice
              }]
            }
          }
        });
      });
    }
  });

  // Add similar blocks for other events
});

See Data Layer documentation for complete implementation.

Host Platform Conflicts

WordPress Issues

Common conflicts:

  • Caching plugins interfere with Ecwid
  • Optimization plugins break JavaScript
  • Other plugins inject conflicting code

Solutions

1. Exclude Ecwid from caching:

WP Rocket:

  • Settings → Advanced Rules
  • Never Cache: Add Ecwid store page

2. Exclude from minification:

Autoptimize:

  • JavaScript Options → Exclude scripts: app.ecwid.com

3. Disable conflicting plugins (temporarily):

  • Deactivate plugins one by one
  • Test after each
  • Identify culprit

Wix Issues

Challenge: Wix loads its own scripts that may interfere.

Solutions:

  • Use Wix's built-in integrations when possible
  • Add tracking to Ecwid (not Wix), as covered in this guide
  • Test in incognito to rule out browser extensions

Squarespace Issues

Challenges:

  • Limited code injection points
  • Squarespace's own tracking may conflict

Solutions:

  • Add tracking code to Ecwid Custom JavaScript Code (not Squarespace)
  • Use same tracking IDs for both if tracking both

Debugging Techniques

1. Browser Console

Enable verbose logging:

Ecwid.OnAPILoaded.add(function() {
  console.log('✓ Ecwid API loaded');

  Ecwid.OnPageLoad.add(function(page) {
    console.log('Page loaded:', page.type, page);
  });

  Ecwid.OnCartChanged.add(function(cart) {
    console.log('Cart changed:', cart);
  });

  Ecwid.OnOrderPlaced.add(function(order) {
    console.log('Order placed:', order);
  });
});

2. Track All Data Layer Pushes

var originalPush = window.dataLayer.push;
window.dataLayer.push = function() {
  console.log('Data Layer Push:', arguments[0]);
  return originalPush.apply(window.dataLayer, arguments);
};

3. Check Network Requests

Chrome DevTools → Network tab:

  1. Filter by "analytics" or "gtag" or "facebook"
  2. Navigate store
  3. Check for requests to:
    • google-analytics.com (GA4)
    • facebook.com/tr (Meta Pixel)
    • googletagmanager.com (GTM)

If no requests: Tracking not firing at all.

4. Test in Isolation

Create minimal test page:

<!DOCTYPE html>
<html>
<head>
  <!-- Only Ecwid + tracking code, nothing else -->
  <script src="https://app.ecwid.com/script.js?12345678"></script>

  <!-- Your tracking code -->
  <script>
    // GA4/Meta Pixel/etc.
  </script>
</head>
<body>
  <div id="my-store-12345678"></div>
</body>
</html>

If works here but not on live site: Conflict with other code/plugins.

Common Error Messages

"Ecwid is not defined"

Cause: Code runs before Ecwid loads.

Fix: Wrap in Ecwid.OnAPILoaded.add().

"gtag is not defined"

Cause: GA4 script not loaded.

Fix:

  • Verify GA4 script in <head>
  • Check for JavaScript errors blocking it
  • Ensure ad blocker disabled

"fbq is not defined"

Cause: Meta Pixel script not loaded.

Fix:

  • Verify Pixel base code added
  • Check Pixel ID is correct
  • Disable ad blocker for testing

"Cannot read property 'push' of undefined"

Cause: Trying to push to data layer before initialized.

Fix:

// Initialize first
window.dataLayer = window.dataLayer || [];

// Then push
dataLayer.push({...});

Testing Workflow

Step-by-Step Testing

  1. Clear browser cache (Ctrl+Shift+Del)

  2. Open incognito window

  3. Open DevTools (F12)

  4. Go to Console tab

  5. Load store:

    // Should see in console
"✓ Ecwid API loaded"

  6. Navigate to product:

    // Should see
"Page loaded: PRODUCT"

  7. Add to cart:

    // Should see
"Cart changed: ..."

  8. Start checkout:

    // Should see
"Page loaded: CHECKOUT_ADDRESS"

  9. Complete test order:

    // Should see
"Order placed: ..."

  10. Verify in analytics:

    • GA4 Realtime reports
    • Meta Events Manager
    • GTM Preview mode

When to Get Help

Consider Professional Help

  • Events still not firing after troubleshooting
  • Complex custom requirements
  • Multiple tracking platforms
  • Time-sensitive launch

Find experts:

  • Ecwid Partner directory
  • Freelancer platforms (Upwork, Fiverr)
  • Web analytics consultants

Support Resources

Ecwid Support:

Platform Support:

Next Steps

For general troubleshooting strategies, see Tracking Troubleshooting Guide.

Nach oben