Debug BigCommerce Events Not Firing

When analytics or marketing pixel events aren't firing correctly on your BigCommerce store, it can lead to incomplete data, failed conversions tracking, and ineffective ad campaigns. This guide helps diagnose and fix tracking issues.

Common Symptoms

• Events don't appear in GA4 DebugView or Meta Events Manager
• Tags show as "Not Fired" in Google Tag Manager Preview
• Conversion tracking not working
• Purchase events missing
• Checkout events not tracking
• Real-time reports show no activity despite site traffic

Diagnostic Workflow

Step 1: Verify Script is Loaded

Before troubleshooting events, confirm the tracking script itself loads.

For GA4 (gtag.js)

Open Browser Console:

// Check if gtag is defined
if (typeof gtag !== 'undefined') {
  console.log('✓ GA4 gtag is loaded');
} else {
  console.error('✗ GA4 gtag is NOT loaded');
}

// Check dataLayer exists
if (typeof dataLayer !== 'undefined') {
  console.log('✓ dataLayer exists:', dataLayer);
} else {
  console.error('✗ dataLayer does NOT exist');
}

For Google Tag Manager

// Check if GTM is loaded
if (typeof google_tag_manager !== 'undefined') {
  console.log('✓ GTM is loaded');
  console.log('Container ID:', Object.keys(google_tag_manager));
} else {
  console.error('✗ GTM is NOT loaded');
}

For Meta Pixel

// Check if Meta Pixel is loaded
if (typeof fbq !== 'undefined') {
  console.log('✓ Meta Pixel is loaded');

  // Get Pixel ID
  if (window._fbq && window._fbq.instance) {
    console.log('Pixel IDs:', Object.keys(window._fbq.instance.pixelsByID));
  }
} else {
  console.error('✗ Meta Pixel is NOT loaded');
}

Step 2: Check Script Manager Configuration

If scripts aren't loading, check Script Manager settings.

Verify Script is Active

1. Go to Storefront > Script Manager
2. Find your tracking script
3. Check status column shows "Active" (green checkmark)
4. If inactive, toggle to Active and save

Check Placement Rules

1. Click Edit on the script
2. Verify Placement includes the page you're testing
   • "All pages" should work everywhere
   • Specific page types must match current page
3. Check Script Location (Header vs Footer)
   • GA4 and GTM should be in Header
   • Checkout scripts may need Footer

Verify Script Code

1. Click Edit on the script
2. Check for syntax errors:
   • Missing closing tags </script>
   • Incorrect Measurement ID or Pixel ID
   • Extra spaces or line breaks in IDs
   • Copy-paste errors (smart quotes, hidden characters)

Common Errors:

<!-- WRONG: Missing script tag -->
<script>
gtag('config', 'G-XXXXXXXXXX')
<!-- Missing </script> tag! -->

<!-- WRONG: Incorrect ID format -->
gtag('config', 'GA-XXXXXXXXXX')  <!-- Should be G-XXXXXXXXXX for GA4 -->

<!-- CORRECT -->
<script>
gtag('config', 'G-XXXXXXXXXX');
</script>

Step 3: Check Browser Network Requests

Verify tracking scripts make network requests.

Open Network Tab

1. Open Chrome DevTools (F12)
2. Go to Network tab
3. Reload page
4. Filter by tracking domain:
   • GA4: google-analytics.com
   • GTM: googletagmanager.com
   • Meta: facebook.com/tr

Verify Requests

GA4 Request:

• Look for request to https://www.google-analytics.com/g/collect
• Check Headers tab for Measurement ID (tid=G-XXXXXXXXXX)
• Check Payload tab for event name (en=page_view)

GTM Request:

• Look for https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX
• Should load GTM container
• Additional requests for tags fired

Meta Pixel Request:

• Look for https://www.facebook.com/tr/
• Check Query String Parameters for:
  • id: Pixel ID
  • ev: Event name (PageView, Purchase, etc.)

Check for Blocked Requests

Status Codes:

• 200 OK: Request successful
• Failed / Blocked: Check for:
  • Ad blockers
  • Privacy extensions (Privacy Badger, uBlock Origin)
  • Corporate firewall blocking tracking
  • Browser privacy settings blocking cookies

Test in Incognito Mode:

• Disable all extensions
• Test if events fire
• If working in incognito, an extension is blocking tracking

Step 4: Check for JavaScript Errors

JavaScript errors can prevent tracking code from executing.

Review Console Errors

1. Open DevTools > Console tab
2. Look for red error messages
3. Common errors affecting tracking:

Syntax Errors:

Uncaught SyntaxError: missing ) after argument list

Fix: Check for typos in tracking code.

Reference Errors:

Uncaught ReferenceError: gtag is not defined

Fix: Ensure tracking script loads before tracking calls.

Type Errors:

Uncaught TypeError: Cannot read property 'push' of undefined

Fix: Initialize dataLayer before pushing events.

Fix Order of Script Execution

Problem:

<!-- WRONG: Event fires before gtag is loaded -->
<script>
  gtag('event', 'page_view');  // Error! gtag not defined yet
</script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>

Solution:

<!-- CORRECT: Load gtag first, then fire events -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
  gtag('event', 'page_view');
</script>

BigCommerce-Specific Issues

Issue 1: Checkout Events Not Tracking (Standard Plan)

Problem: Checkout and purchase events don't fire.

Cause: BigCommerce Standard plan doesn't support checkout script injection.

Solutions:

Option 1: Use Conversion Tracking Code (All Plans)

1. Go to Settings > Analytics
2. Scroll to Conversion Tracking Code
3. Add tracking code using BigCommerce variables:

<script>
if (typeof gtag !== 'undefined') {
  gtag('event', 'purchase', {
    transaction_id: '%%ORDER_ID%%',
    value: %%ORDER_AMOUNT%%,
    currency: '%%GLOBAL_CurrencyCode%%'
  });
}
</script>

Option 2: Upgrade to Plus, Pro, or Enterprise

• Allows checkout script injection
• Full access to checkout page tracking
• Better data quality and completeness

Issue 2: Stencil Context Data Not Available

Problem: Handlebars variables return undefined or empty.

Cause: Template doesn't have access to specific context objects.

Diagnosis:

{{!-- Debug: Print entire context --}}
<script>
  console.log('Available context:', {{{jsContext}}});
</script>

Common Context Availability:

Solution:

{{!-- Check if context exists before using --}}
{{#if product}}
<script>
  gtag('event', 'view_item', {
    item_id: '{{product.id}}',
    item_name: '{{product.name}}'
  });
</script>
{{/if}}

Issue 3: Akamai CDN Caching Old Scripts

Problem: Updated scripts don't take effect.

Cause: Akamai CDN caches scripts for faster delivery.

Solution:

1. Clear BigCommerce Cache:

   • Go to Server Settings > Performance
   • Click Clear Store Cache

2. Hard Refresh Browser:

   • Chrome/Edge: Ctrl+Shift+R (Cmd+Shift+R on Mac)
   • Firefox: Ctrl+F5

3. Wait for CDN Propagation:

   • Allow 5-10 minutes for cache to clear globally
   • Test in incognito mode

4. Verify Cache is Cleared:

   • Check Network tab in DevTools
   • Look for cache-control headers
   • Verify script content is updated

Issue 4: Theme vs. Script Manager Conflicts

Problem: Duplicate or conflicting tracking implementations.

Cause: Tracking code exists in both Stencil theme AND Script Manager.

Diagnosis:

1. Search Theme Files:

   • Download theme
   • Search for gtag, fbq, or GTM- in all files
   • Check templates/layout/base.html

2. Check Script Manager:

   • Review all active scripts
   • Look for duplicate implementations

Solution:

Choose ONE implementation method:

• Remove from theme if using Script Manager (easier to manage)
• Remove from Script Manager if using Stencil (better data layer integration)

Never implement in both places unless intentionally sending events to multiple properties.

Issue 5: Events Fire on Storefront but Not Checkout

Problem: Events track on product/category pages but not checkout.

Cause: Checkout is hosted separately and requires separate script installation.

Solution:

For Plus, Pro, Enterprise Plans:

1. Go to Settings > Checkout
2. Scroll to Checkout Scripts
3. Add tracking code to Header Scripts:

<!-- Google Analytics 4 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
</script>

<!-- Meta Pixel -->
<script>
!function(f,b,e,v,n,t,s){/* Meta Pixel code */}(window, document,'script'...);
fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');
</script>

4. Track checkout events using BCData.checkout object:

<script>
(function checkForCheckout() {
  if (typeof BCData !== 'undefined' && BCData.checkout) {
    // Checkout data available, fire events
    if (window.location.pathname.includes('order-confirmation')) {
      // Purchase event
      gtag('event', 'purchase', {
        transaction_id: BCData.checkout.order.orderId,
        value: BCData.checkout.cart.baseAmount,
        currency: BCData.checkout.cart.currency.code
      });
    } else {
      // Checkout initiation
      gtag('event', 'begin_checkout', {
        value: BCData.checkout.cart.baseAmount,
        currency: BCData.checkout.cart.currency.code
      });
    }
  } else {
    setTimeout(checkForCheckout, 100);
  }
})();
</script>

Platform-Specific Debugging

Debugging GA4 Events

Enable Debug Mode

Add to Script Manager or theme:

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

Or add URL parameter: ?_ga_debug=1

Use GA4 DebugView

1. Go to Google Analytics > Admin > DebugView
2. Perform actions on your store
3. Events appear in real-time with full parameters
4. Check for:
   • Event names
   • Parameter names and values
   • Errors or warnings

Check for Common GA4 Issues

Issue: Events sent but not in reports

• Allow 24-48 hours for processing
• Check DebugView for real-time validation
• Verify Measurement ID is correct

Issue: Parameters missing

• Check parameter names (must be lowercase with underscores)
• Verify values aren't undefined or null
• Ensure parameters are in correct format (strings, numbers)

Debugging GTM Tags

Use GTM Preview Mode

1. In GTM, click Preview
2. Enter your BigCommerce store URL
3. Click Connect
4. New tab opens with GTM debug panel

Debug Panel Sections:

• Summary: Overview of page state
• Variables: Data layer and built-in variables
• Tags: Which tags fired, didn't fire, and why
• Data Layer: All data layer pushes

Check Tag Firing Conditions

Tag not firing? Check:

1. Trigger Configuration:

   • Event name matches data layer event
   • Trigger conditions are met
   • No blocking triggers

2. Variables:

   • Data layer variables are defined
   • Values aren't undefined or empty
   • Variable names match data layer paths

3. Tag Sequencing:

   • Setup tags fired first
   • Dependent tags fire in order

Debug Data Layer

// View entire data layer
console.table(dataLayer);

// Find specific events
dataLayer.filter(item => item.event === 'purchase');

// Watch data layer changes
var originalPush = dataLayer.push;
dataLayer.push = function() {
  console.log('Data layer push:', arguments[0]);
  return originalPush.apply(dataLayer, arguments);
};

Debugging Meta Pixel Events

Enable Meta Pixel Debug Mode

// Add to browser console
fbq.debug = true;
fbq('set', 'autoConfig', false, 'YOUR_PIXEL_ID');

Use Meta Pixel Helper

1. Install Meta Pixel Helper Chrome Extension
2. Visit your store
3. Click extension icon
4. Check for:
   • Pixel ID correct
   • Events firing
   • Parameters present
   • Warnings or errors

Test Events Tool

1. Go to Meta Events Manager > Test Events
2. Enter your store URL
3. Click Open Website
4. Perform actions
5. Verify events appear with parameters

Common Meta Pixel Issues:

Issue: Pixel loads but events don't fire

• Check fbq('track', 'EventName') syntax
• Verify event name spelling (case-sensitive)
• Ensure pixel initialized before tracking

Issue: Parameters missing

• Check parameter names match Meta's spec
• Verify values aren't undefined
• Use correct data types (strings vs numbers)

Event-Specific Troubleshooting

Purchase Events Not Tracking

Check these points:

1. Event fires on correct page:

   • Order confirmation page only
   • Not on checkout step pages

2. Transaction ID is unique:

   • Use actual order ID, not generic placeholder
   • Check for duplicate transaction IDs

3. Value and currency included:

   • value parameter is a number (not string)
   • currency matches transaction currency

4. Items array structured correctly:

   • Each item has item_id and item_name
   • Quantities and prices are numbers

Example Correct Purchase Event:

gtag('event', 'purchase', {
  transaction_id: '12345',
  value: 99.99,
  currency: 'USD',
  tax: 8.50,
  shipping: 5.00,
  items: [{
    item_id: '123',
    item_name: 'Product Name',
    price: 29.99,
    quantity: 2
  }]
});

Add to Cart Events Not Tracking

Common causes:

1. Event listener not attached:

   • Add to cart button clicked before listener attached
   • Use DOMContentLoaded or attach in footer

2. Element selector incorrect:

   • Theme updated, CSS classes changed
   • Use browser inspect to verify selector

3. Product data not available:

   • Fetch from Storefront API or use data attributes
   • Don't rely on DOM scraping

Debug add to cart:

// Test if event fires
document.addEventListener('click', function(e) {
  if (e.target.closest('[data-button-type="add-cart"]')) {
    console.log('Add to cart clicked!');
    console.log('Element:', e.target);
  }
});

Testing Checklist

Use this checklist to systematically debug tracking issues:

• Verify tracking script loads (check browser console)
• Check Script Manager script is Active
• Verify placement rules include current page
• Check for JavaScript errors in console
• Verify network requests to tracking domains
• Test in incognito mode (no ad blockers)
• Clear BigCommerce store cache
• Hard refresh browser (Ctrl+Shift+R)
• Check data layer exists and has data
• Verify event syntax is correct
• Ensure script order is correct (load before fire)
• Check for duplicate implementations (theme + Script Manager)
• For checkout: verify plan supports checkout scripts
• For GTM: use Preview mode to debug
• For GA4: use DebugView to verify events
• For Meta: use Pixel Helper to verify events
• Test across browsers (Chrome, Firefox, Safari, Edge)
• Test on mobile devices

Quick Fixes Reference

When to Escalate

Contact BigCommerce support or hire a developer if:

• Tracking fails after following all troubleshooting steps
• Need checkout tracking on Standard plan (requires upgrade)
• Complex custom theme prevents tracking implementation
• Server-side tracking or Conversions API needed
• Multiple conflicting apps causing tracking issues

Next Steps

• Fix LCP Issues
• Fix CLS Issues
• Troubleshooting Overview

Additional Resources

• GA4 DebugView
• GTM Preview Mode
• Meta Pixel Helper
• BigCommerce Script Manager Documentation