Shopify Troubleshooting Overview | Blue Frog Docs

Shopify Troubleshooting Overview

Troubleshoot common Shopify issues including performance problems and tracking failures.

Shopify Troubleshooting Overview

Common issues you may encounter with your Shopify store and how to diagnose and fix them.

Performance Issues

Shopify store performance directly impacts conversion rates and SEO. Core Web Vitals are critical metrics that affect both user experience and search rankings.

Largest Contentful Paint (LCP)

LCP measures loading performance. Shopify-specific LCP issues include:

  • Theme JavaScript and CSS blocking render
  • Unoptimized hero images and banners
  • Third-party apps adding render-blocking scripts
  • Dawn theme customizations impacting performance
  • Shopify app scripts loading synchronously

Target: LCP under 2.5 seconds

Cumulative Layout Shift (CLS)

CLS measures visual stability. Shopify-specific CLS issues include:

  • Product images without dimensions
  • Dynamic content from apps shifting layouts
  • Font loading causing layout shifts
  • Announcement bars and popups
  • Cart drawer animations

Target: CLS under 0.1

General Performance Best Practices

Theme Selection:

  • Use Shopify 2.0 themes (Dawn, or other OS 2.0 themes)
  • Avoid heavily customized legacy themes
  • Regularly update theme to latest version

App Management:

  • Audit installed apps quarterly
  • Remove unused apps completely (don't just disable)
  • Consolidate app functionality where possible
  • Use GTM to manage tracking instead of individual app scripts

Image Optimization:

  • Use Shopify's built-in image optimization
  • Implement lazy loading for below-fold images
  • Use proper image formats (WebP with fallbacks)
  • Set explicit width and height attributes

Code Optimization:

  • Minimize custom JavaScript
  • Use async/defer for non-critical scripts
  • Minimize and combine CSS files
  • Remove unused theme code

For general performance concepts, see the global performance hub.

Tracking & Analytics Issues

Events Not Firing

Common causes of tracking failures on Shopify:

  • Shopify checkout limitations (non-Plus stores)
  • JavaScript errors from theme or apps
  • Ad blockers preventing pixel loads
  • Incorrect GTM container configuration
  • Shopify data layer not populating
  • Duplicate implementations causing conflicts

Common scenarios:

  • GA4 events missing from checkout (non-Plus limitation)
  • Meta Pixel not tracking AddToCart (theme JavaScript issue)
  • GTM container not loading (installation error)
  • Purchase events firing multiple times (duplicate code)

Tracking Best Practices

Consolidate Tracking:

  • Use GTM as single source for all tags
  • Remove native Shopify integrations when using GTM
  • Uninstall redundant tracking apps
  • Document all tracking implementations

Test Thoroughly:

  • Use browser extensions (GTM debugger, GA debugger, Meta Pixel Helper)
  • Test in incognito/private browsing
  • Test across different browsers
  • Test on mobile devices
  • Verify in platform analytics (GA4, Meta Events Manager)

Monitor Continuously:

  • Set up alerts for tracking failures
  • Review data quality weekly
  • Check for bot traffic in analytics
  • Monitor conversion tracking accuracy

For general tracking concepts, see the global troubleshooting hub.

Common Shopify-Specific Issues

Checkout Access (Non-Plus Stores)

Problem: Cannot add custom scripts to checkout pages.

Limitation: Shopify Basic, Shopify, and Advanced plans don't allow checkout customization.

Workaround:

  • Track begin_checkout on cart page when checkout button clicked
  • Track purchase on order confirmation page using Additional Scripts
  • Upgrade to Shopify Plus for full checkout access

Shopify Apps Breaking Site

Problem: App causes JavaScript errors or conflicts.

Diagnosis:

  1. Open browser console (F12)
  2. Look for JavaScript errors
  3. Disable apps one at a time to identify culprit
  4. Check app reviews for known issues

Fix:

  • Contact app developer for support
  • Use alternative app
  • Remove app and implement functionality differently

Theme Customizations Lost on Update

Problem: Theme updates overwrite custom code.

Prevention:

  • Use theme sections instead of editing core files
  • Document all customizations
  • Use version control (GitHub) for theme code
  • Test updates on duplicate/staging theme first

Recovery:

  • Restore from theme backup (if available)
  • Download previous theme version
  • Re-implement customizations

Data Layer Not Populating

Problem: Shopify data layer is empty or missing events.

Causes:

  • Old theme without data layer support
  • Custom theme missing Shopify scripts
  • JavaScript errors preventing data layer pushes

Fix:

  • Update to modern theme (Dawn, OS 2.0)
  • Manually implement data layer events
  • Fix JavaScript errors blocking execution

Multi-Currency Tracking Issues

Problem: Analytics showing incorrect currency values.

Causes:

  • Currency not passed to analytics
  • Values not converted to single currency
  • Multi-currency app interfering

Fix:

currency: '{{ cart.currency.iso_code }}'  // Pass actual currency
  • Configure GA4 to handle multiple currencies
  • Use Shopify Markets for proper multi-currency setup

Debugging Tools

Browser Developer Tools

Chrome DevTools (F12):

  • Console: Check for JavaScript errors
  • Network: Verify analytics requests sent
  • Application: Check localStorage, cookies, session data

Shopify-Specific Tools

Shopify Theme Inspector:

?preview_theme_id=YOUR_THEME_ID

Preview theme changes before publishing.

Shopify Data Layer Inspector:

// Run in browser console
console.table(window.dataLayer);

Analytics Debugging Tools

Browser Extensions:

Platform Tools:

  • GA4 DebugView
  • Meta Events Manager Test Events
  • GTM Preview Mode

Performance Testing Tools

Getting Help

Shopify Support Channels

Shopify Help Center:

Shopify Community:

Shopify Support:

  • 24/7 chat support (for paid plans)
  • Email support
  • Phone support (Plus stores)

When to Hire a Developer

Consider hiring a Shopify Expert when:

  • Complex custom functionality needed
  • Multiple JavaScript errors you can't resolve
  • Theme requires significant customization
  • Performance issues persist despite optimizations
  • Migration from another platform

Shopify Experts:

Next Steps

Performance Issues:

Tracking Issues:

Prevention:

  • Document your setup
  • Test before deploying
  • Monitor regularly
  • Keep apps and themes updated
// SYS.FOOTER