BigCommerce Tracking Issues

Platform-specific guides for diagnosing and fixing analytics and tracking issues on BigCommerce.

Common Issues

Events Not Firing

Debug why analytics events aren't being captured on BigCommerce.

BigCommerce-Specific Tracking Challenges

BigCommerce's Stencil framework and SaaS architecture present unique tracking challenges that require platform-specific troubleshooting approaches.

Platform Code Injection Limitations

BigCommerce restricts where custom JavaScript can be added, which affects tracking implementation:

Script Manager Restrictions:

• Scripts added via Script Manager only load on specific page types
• Footer scripts may load after critical events have already occurred
• Header scripts in Script Manager don't have access to early DOM events
• Consent management scripts may block Script Manager injections

Theme File Limitations:

• Custom theme modifications require Stencil CLI setup and WebDAV access
• Not all merchants have access to theme file editing
• Theme updates can overwrite custom tracking code
• Different themes expose different Handlebars variables

Code Example - Checking Script Manager Placement:

// Add this to verify when your tracking script loads
console.log('Tracking script loaded at:', new Date().toISOString());
console.log('DOM ready state:', document.readyState);
console.log('Page type:', window.BCData?.page_type || 'unknown');

Theme Compatibility Issues

BigCommerce themes handle data layers and events differently:

Cornerstone vs Custom Themes:

• Cornerstone theme has built-in hooks for common events
• Custom themes may not emit standard ecommerce events
• Theme-specific JavaScript can interfere with tracking libraries
• AJAX cart updates may not trigger traditional page events

Handlebars Template Variables:

{{!-- Accessing product data in Stencil templates --}}
<script>
window.productData = {
  id: {{product.id}},
  name: '{{product.title}}',
  price: {{product.price.without_tax.value}},
  sku: '{{product.sku}}',
  category: '{{product.category}}'
};
</script>

App and Plugin Conflicts

Multiple BigCommerce apps can create tracking conflicts:

Common Conflict Scenarios:

• Multiple apps injecting competing Google Analytics tags
• Marketing apps overwriting dataLayer variables
• Chat widgets blocking tracking script execution
• Currency converter apps changing price values mid-page load

Diagnostic Script:

// Check for multiple tracking instances
const scripts = Array.from(document.querySelectorAll('script'));
const gaScripts = scripts.filter(s =>
  s.src.includes('google-analytics.com') ||
  s.src.includes('googletagmanager.com')
);
console.log('Found', gaScripts.length, 'Google Analytics scripts');

// Check for dataLayer conflicts
if (window.dataLayer) {
  console.log('dataLayer pushes:', window.dataLayer.length);
  console.log('dataLayer contents:', window.dataLayer);
}

Stencil Framework Specific Issues

AJAX Navigation Events: BigCommerce uses AJAX for cart updates and quick view modals, which don't trigger traditional page loads:

// Listen for BigCommerce-specific events
document.addEventListener('cart-item-add', function(event) {
  console.log('Cart add event:', event.detail);
  // Your tracking code here
});

document.addEventListener('cart-item-update', function(event) {
  console.log('Cart update event:', event.detail);
});

// Monitor for quick view modal opens
if (window.stencilUtils) {
  console.log('Stencil Utils available for API calls');
}

Comprehensive Diagnostic Checklist

Follow this systematic approach to identify tracking issues:

1. Verify Script Placement

Check Script Manager Configuration:

• Navigate to Storefront → Script Manager
• Verify scripts are set to "All pages" or appropriate page types
• Confirm placement is "Header" for critical tracking
• Check that scripts are enabled (not disabled)

Code to Add for Verification:

// Script Manager diagnostic
(function() {
  const config = {
    scriptLocation: 'Script Manager',
    loadTime: performance.now(),
    pageType: window.BCData?.page_type,
    url: window.location.href
  };
  console.log('BigCommerce Tracking Diagnostic:', config);

  // Send to your analytics for debugging
  // Example: dataLayer.push({event: 'debug', config: config});
})();

2. Inspect BigCommerce Data Objects

BigCommerce exposes useful data in window.BCData:

// Check available BigCommerce data
console.log('BCData:', window.BCData);
console.log('Customer:', window.BCData?.customer);
console.log('Cart:', window.BCData?.cart_id);
console.log('Page type:', window.BCData?.page_type);

// Product page specific data
if (BCData?.page_type === 'product') {
  console.log('Product ID:', BCData.product_id);
}

3. Monitor Cart Events

// Comprehensive cart event monitoring
const cartEvents = [
  'cart-item-add',
  'cart-item-remove',
  'cart-item-update',
  'cart-quantity-update'
];

cartEvents.forEach(eventName => {
  document.addEventListener(eventName, function(event) {
    console.log(`[${eventName}]`, event.detail);
    // Track cart changes here
  });
});

4. Check Theme Template Loading

// Verify which templates are active
if (window.stencilUtils) {
  console.log('Stencil Utils loaded successfully');

  // You can make API calls to get product/cart data
  stencilUtils.api.cart.getCart({}, (err, response) => {
    if (err) {
      console.error('Cart API error:', err);
    } else {
      console.log('Cart data:', response);
    }
  });
}

5. Validate Checkout Tracking

BigCommerce's checkout may be on a different domain or use an embedded checkout:

// Check checkout configuration
console.log('Checkout type:', BCData?.checkout_type);
console.log('Checkout URL:', BCData?.checkout_url);

// For embedded checkout, tracking must be set up differently
if (BCData?.checkout_type === 'embedded') {
  console.log('Using embedded checkout - tracking requires special setup');
}

Browser DevTools Debugging Steps

Network Tab Investigation

1. Filter for Analytics Requests:

Filter: /collect|/analytics|/pixel|/track/

2. Check Request Payload:

• Right-click the request → Copy → Copy as cURL
• Verify parameters match expected values
• Check for proper encoding of product names and values

3. Look for Failed Requests:

• Red/failed requests indicate blocking or errors
• Check response codes (403 = blocked, 404 = wrong endpoint)
• Verify CORS headers for cross-domain tracking

Console Debugging Commands

// Enable verbose logging for Google Analytics
window.ga_debug = {trace: true};

// For GTM debugging
window.google_tag_manager['GTM-XXXXX'].dataLayer.get('gtm.start');

// Check all global tracking objects
console.log({
  dataLayer: window.dataLayer,
  ga: window.ga,
  gtag: window.gtag,
  fbq: window.fbq,
  _kmq: window._kmq,
  analytics: window.analytics // Segment
});

Application Tab Storage Inspection

Check Cookies:

• Look for _ga, _gid (Google Analytics)
• Verify cookie domain matches your store domain
• Check cookie expiration dates

Local Storage:

// View all localStorage keys
Object.keys(localStorage).forEach(key => {
  console.log(key, localStorage.getItem(key));
});

Common Symptoms and Causes

Tag Manager Troubleshooting

Google Tag Manager on BigCommerce

Common GTM Issues:

1. Container Not Loading:

// Verify GTM container loaded
if (window.google_tag_manager) {
  console.log('GTM containers:', Object.keys(window.google_tag_manager));
} else {
  console.error('GTM container not loaded - check Script Manager');
}

2. Data Layer Timing:

// Initialize data layer BEFORE GTM snippet
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  platform: 'BigCommerce',
  customerId: BCData?.customer?.id || null,
  pageType: BCData?.page_type
});

3. Preview Mode Issues:

• BigCommerce Script Manager may block GTM preview
• Test in published mode first
• Use GTM debug extension instead of preview mode

Enhanced E-commerce Implementation:

// Product detail page
if (BCData?.page_type === 'product') {
  dataLayer.push({
    event: 'productDetail',
    ecommerce: {
      detail: {
        products: [{
          id: productData.id,
          name: productData.name,
          price: productData.price,
          brand: productData.brand || '',
          category: productData.category
        }]
      }
    }
  });
}

E-commerce Tracking Issues

Cart and Checkout Tracking

Add to Cart Event:

document.addEventListener('cart-item-add', function(event) {
  const item = event.detail;

  dataLayer.push({
    event: 'addToCart',
    ecommerce: {
      add: {
        products: [{
          id: item.id,
          name: item.name,
          price: item.price,
          quantity: item.quantity
        }]
      }
    }
  });
});

Checkout Tracking Challenges:

BigCommerce checkout pages may be:

• On a different subdomain (checkout.yourdomain.com)
• Using embedded checkout (iframe)
• Managed by BigCommerce with limited script access

Solution for Optimized One-Page Checkout:

// Add to Script Manager for checkout pages only
if (BCData?.page_type === 'checkout') {
  dataLayer.push({
    event: 'checkout',
    ecommerce: {
      checkout: {
        actionField: {step: 1},
        products: BCData?.cart?.items || []
      }
    }
  });
}

Order Confirmation Tracking:

{{!-- In order confirmation template --}}
<script>
dataLayer.push({
  event: 'purchase',
  ecommerce: {
    purchase: {
      actionField: {
        id: '{{order.id}}',
        revenue: '{{order.total}}',
        tax: '{{order.tax}}',
        shipping: '{{order.shipping}}'
      },
      products: [
        {{#each order.items}}
        {
          id: '{{id}}',
          name: '{{name}}',
          price: '{{price}}',
          quantity: {{quantity}}
        }{{#unless @last}},{{/unless}}
        {{/each}}
      ]
    }
  }
});
</script>

Cookie and Consent Management

BigCommerce Cookie Consent Challenges

Common Consent Tool Integrations:

• OneTrust
• Cookiebot
• Cookie Consent by LiveChat
• Custom consent banners

Conditional Loading Pattern:

// Wait for consent before loading analytics
window.addEventListener('CookiebotOnAccept', function() {
  if (Cookiebot.consent.statistics) {
    // Load analytics scripts
    loadGoogleAnalytics();
  }
}, false);

function loadGoogleAnalytics() {
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');

  // Load GA script
  const script = document.createElement('script');
  script.src = 'https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX';
  script.async = true;
  document.head.appendChild(script);
}

Google Consent Mode v2:

// Set default consent state before GTM loads
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
});

// Update consent based on user choice
function updateConsent(analytics, marketing) {
  gtag('consent', 'update', {
    'analytics_storage': analytics ? 'granted' : 'denied',
    'ad_storage': marketing ? 'granted' : 'denied',
    'ad_user_data': marketing ? 'granted' : 'denied',
    'ad_personalization': marketing ? 'granted' : 'denied'
  });
}

When to Contact Support

Contact BigCommerce support when you encounter:

Platform-Level Issues:

• Script Manager scripts not loading at all
• Theme files not saving changes
• WebDAV access problems
• Checkout domain configuration issues

Contact Your Analytics Vendor When:

• Events are firing but not appearing in reports
• Data is being collected but showing incorrect values
• Conversion tracking is attributed incorrectly
• Real-time data shows up but historical data doesn't

Contact Your Theme Developer When:

• Custom theme doesn't expose necessary data variables
• Theme updates break tracking implementation
• Template modifications don't persist
• Theme-specific JavaScript conflicts with tracking

Information to Provide in Support Requests:

1. BigCommerce store URL and store hash
2. Script Manager configuration screenshots
3. Browser console errors (screenshot or text)
4. Network tab showing failed requests
5. Specific page URLs where tracking fails
6. Theme name and version
7. List of installed apps that might conflict
8. Consent management tool in use

General Fixes

For universal tracking concepts, see the Global Tracking Issues Hub.

Related Guides

• BigCommerce Troubleshooting Overview
• Performance Issues