HubSpot Google Analytics Integration | Blue Frog Docs

HubSpot Google Analytics Integration

Integrate Google Analytics 4 with HubSpot for comprehensive analytics tracking.

HubSpot Google Analytics Integration

Complete guide to setting up Google Analytics 4 (GA4) on your HubSpot site for comprehensive user behavior and conversion tracking.

Overview

HubSpot provides native Google Analytics 4 integration alongside built-in HubSpot analytics, giving you the best of both worlds. You can leverage HubSpot's marketing automation while gaining deeper insights from GA4's advanced analytics capabilities. The integration is straightforward and works seamlessly with HubSpot CMS, landing pages, and forms.

Key Benefits

  • Dual Analytics Power: Combine HubSpot's marketing analytics with GA4's behavioral insights
  • Form Tracking: Automatic tracking of HubSpot form submissions
  • CTA Monitoring: Track call-to-action button clicks and conversions
  • Landing Page Analytics: Detailed performance metrics for landing pages
  • Lead Attribution: Connect GA4 data with HubSpot's lead tracking

Installation Methods

HubSpot offers built-in GA4 integration for seamless tracking.

Step 1: Access Tracking Code Settings

  1. Log in to your HubSpot account
  2. Navigate to Settings (gear icon in top navigation)
  3. In the left sidebar, go to Tracking & Analytics > Tracking Code

Step 2: Add GA4 Tracking

  1. Scroll to the Google Analytics section
  2. Click Add Google Analytics
  3. Enter your GA4 Measurement ID (format: G-XXXXXXXXXX)
  4. Select tracking options:
    • Track all HubSpot-hosted pages
    • Track HubSpot forms
    • Track CTAs

Step 3: Configure Domain Settings

  1. In Tracking & Analytics, go to Domains & URLs
  2. Ensure your domain is properly configured
  3. Verify SSL certificate is active
  4. Save settings

Method 2: Custom Code Installation

For advanced implementations or custom tracking requirements.

Step 1: Add Code to Site Header

  1. Navigate to Settings > Website > Pages
  2. Click the Templates tab
  3. Select your active template
  4. Click Edit > Settings > Advanced Options
  5. Add to Site Header HTML:
<!-- Google tag (gtag.js) -->
<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', {
    'send_page_view': true,
    'cookie_flags': 'SameSite=None;Secure'
  });
</script>

Step 2: Apply to All Pages

For site-wide tracking without template editing:

  1. Go to Settings > Website > Pages
  2. Click Site Header HTML in the header section
  3. Paste the GA4 code
  4. Click Save

Configuration Options

HubSpot-Specific Tracking

Leverage HubSpot data in GA4:

<script>
  gtag('config', 'G-XXXXXXXXXX', {
    'custom_map': {
      'dimension1': 'hubspot_contact_id',
      'dimension2': 'lifecycle_stage',
      'dimension3': 'persona'
    }
  });

  // Send HubSpot contact data
  var _hsq = window._hsq = window._hsq || [];
  _hsq.push(['identify', {
    email: '{{ contact.email }}',
    id: '{{ contact.vid }}'
  }]);

  // Track contact properties in GA4
  if (typeof {{ contact.vid }} !== 'undefined') {
    gtag('set', 'user_properties', {
      'hubspot_contact_id': '{{ contact.vid }}',
      'lifecycle_stage': '{{ contact.lifecyclestage }}',
      'lead_status': '{{ contact.hs_lead_status }}'
    });
  }
</script>

Cross-Domain Tracking

For tracking across multiple HubSpot domains:

<script>
  gtag('config', 'G-XXXXXXXXXX', {
    'linker': {
      'domains': ['www.yoursite.com', 'blog.yoursite.com', 'shop.yoursite.com']
    }
  });
</script>

Implement cookie consent with HubSpot's privacy tools:

<script>
  // Check HubSpot cookie consent
  var _hsp = window._hsp = window._hsp || [];

  _hsp.push(['addPrivacyConsentListener', function(consent) {
    if (consent.categories.analytics) {
      gtag('consent', 'update', {
        'analytics_storage': 'granted'
      });
    } else {
      gtag('consent', 'update', {
        'analytics_storage': 'denied'
      });
    }
  }]);

  // Set default consent state
  gtag('consent', 'default', {
    'analytics_storage': 'denied',
    'wait_for_update': 500
  });
</script>

Event Tracking

HubSpot Form Submissions

Automatically track form completions:

<script>
  window.addEventListener('message', function(event) {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
      gtag('event', 'form_submit', {
        'form_id': event.data.id,
        'form_name': event.data.data.formName || 'HubSpot Form',
        'page_path': window.location.pathname
      });
    }
  });
</script>

CTA Click Tracking

Track HubSpot CTA clicks:

<script>
  document.addEventListener('DOMContentLoaded', function() {
    // Track HubSpot CTA clicks
    var ctas = document.querySelectorAll('.hs-cta-wrapper a');

    ctas.forEach(function(cta) {
      cta.addEventListener('click', function() {
        var ctaId = this.getAttribute('data-hs-cta-id');
        var ctaText = this.textContent.trim();

        gtag('event', 'cta_click', {
          'cta_id': ctaId,
          'cta_text': ctaText,
          'page_location': window.location.href
        });
      });
    });
  });
</script>

Meeting/Demo Bookings

Track meeting scheduler interactions:

<script>
  // HubSpot Meetings tracking
  var _hsq = window._hsq = window._hsq || [];

  _hsq.push(['trackCustomBehavioralEvent', {
    name: 'pe22175099_meeting_booked',
    properties: {
      meeting_type: 'demo',
      meeting_link: window.location.href
    }
  }]);

  // Also send to GA4
  gtag('event', 'meeting_booked', {
    'meeting_type': 'demo',
    'value': 100, // Estimated value of a demo
    'currency': 'USD'
  });
</script>

Blog Engagement

Track blog post interactions on HubSpot blogs:

<script>
  // Track blog reading time
  var startTime = new Date().getTime();

  window.addEventListener('beforeunload', function() {
    var timeSpent = Math.round((new Date().getTime() - startTime) / 1000);

    if (timeSpent > 10) { // Only track if more than 10 seconds
      gtag('event', 'blog_engagement', {
        'time_on_page': timeSpent,
        'blog_title': document.title,
        'blog_category': '{{ content.blog_post_tags }}'
      });
    }
  });

  // Track scroll depth
  var scrollTracked = {25: false, 50: false, 75: false, 100: false};

  window.addEventListener('scroll', function() {
    var scrollPercent = Math.round((window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100);

    Object.keys(scrollTracked).forEach(function(threshold) {
      if (scrollPercent >= threshold && !scrollTracked[threshold]) {
        gtag('event', 'scroll', {
          'percent_scrolled': threshold,
          'page_type': 'blog_post'
        });
        scrollTracked[threshold] = true;
      }
    });
  });
</script>

Lead Tracking Integration

Connect GA4 with HubSpot CRM

Pass contact information between systems:

<script>
  // Get HubSpot contact info
  var _hsq = window._hsq = window._hsq || [];

  _hsq.push(['identify', {
    email: '{{ contact.email }}',
    firstname: '{{ contact.firstname }}',
    lastname: '{{ contact.lastname }}'
  }]);

  // Send to GA4 as User ID
  if ('{{ contact.vid }}' !== '') {
    gtag('config', 'G-XXXXXXXXXX', {
      'user_id': '{{ contact.vid }}',
      'user_properties': {
        'lifecycle_stage': '{{ contact.lifecyclestage }}',
        'lead_score': '{{ contact.hs_lead_score }}',
        'persona': '{{ contact.persona }}'
      }
    });
  }
</script>

Deal Stage Tracking

Track prospect progression through sales pipeline:

<script>
  // Track deal stage changes
  gtag('event', 'deal_stage_change', {
    'contact_id': '{{ contact.vid }}',
    'old_stage': '{{ previous_deal_stage }}',
    'new_stage': '{{ current_deal_stage }}',
    'deal_value': {{ deal_amount }}
  });
</script>

Landing Page Tracking

Landing Page Conversions

Track landing page form submissions and goals:

<script>
  // Track landing page conversion
  window.addEventListener('message', function(event) {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
      gtag('event', 'conversion', {
        'send_to': 'G-XXXXXXXXXX',
        'event_category': 'Landing Page',
        'event_label': document.title,
        'value': 1
      });

      // Track as lead generation
      gtag('event', 'generate_lead', {
        'page_path': window.location.pathname,
        'campaign_source': '{{ contact.hs_analytics_source }}',
        'campaign_medium': '{{ contact.hs_analytics_source_data_1 }}'
      });
    }
  });
</script>

Troubleshooting

Tracking Code Not Firing

Issue: GA4 not collecting data from HubSpot pages

Solutions:

  1. Verify GA4 Measurement ID is correct in HubSpot settings
  2. Check that tracking code is published (not in draft)
  3. Clear HubSpot CDN cache: Settings > Advanced > Clear Cache
  4. Ensure domain is properly connected in HubSpot
  5. Test in incognito mode to avoid browser cache issues
  6. Verify SSL certificate is active and valid

Duplicate Tracking

Issue: Page views counted twice

Solutions:

  1. Check if GA4 is added in both native settings AND custom code
  2. Remove GA4 from template if using native integration
  3. Verify GTM isn't also loading GA4
  4. Check for GA4 code in custom modules
  5. Review all tracking code locations in HubSpot

Form Submissions Not Tracking

Issue: HubSpot form submits not appearing in GA4

Solutions:

  1. Verify form submission event listener is properly configured
  2. Check browser console for JavaScript errors
  3. Test form in real-time with GA4 DebugView
  4. Ensure form isn't in an iframe blocking events
  5. Verify message event listener is on correct domain
  6. Check HubSpot form settings allow tracking

Contact Data Not Syncing

Issue: HubSpot contact properties not appearing in GA4

Solutions:

  1. Verify contact personalization tokens are correct
  2. Check that contacts have the required properties populated
  3. Ensure privacy settings allow contact identification
  4. Test with known contacts that have complete data
  5. Verify custom dimensions are set up in GA4 property
  6. Check HubSpot contact merge settings

Cross-Domain Tracking Issues

Issue: Sessions breaking across HubSpot subdomains

Solutions:

  1. Verify all domains are listed in linker configuration
  2. Check that GA4 Measurement ID is the same across domains
  3. Ensure cookies aren't blocked between domains
  4. Test with Chrome DevTools to verify linker parameter
  5. Check referral exclusion list in GA4
  6. Verify SSL is enabled on all domains

Performance Impact

Issue: Page load speed decreased after GA4 installation

Solutions:

  1. Ensure async attribute is on the gtag.js script
  2. Use HubSpot's native integration instead of custom code
  3. Minimize custom event tracking on page load
  4. Implement lazy loading for non-critical tracking
  5. Consider using Google Tag Manager for better performance
  6. Enable HubSpot's CDN and caching features

Verification and Testing

Test GA4 Integration

  1. Real-Time Reports: Visit your site and check GA4 Real-time view
  2. Form Testing: Submit a test form and verify event fires
  3. CTA Testing: Click CTAs and confirm in GA4 DebugView
  4. HubSpot Preview: Use HubSpot's preview mode to test tracking

Enable Debug Mode

Add debug parameter to your tracking:

<script>
  gtag('config', 'G-XXXXXXXXXX', {
    'debug_mode': true
  });
</script>

Verify HubSpot Integration

  1. Check Reports > Analytics Tools in HubSpot
  2. Verify GA4 is listed under connected accounts
  3. Test contact property tracking with known contacts
  4. Review HubSpot form analytics for submission counts

Best Practices

Data Layer Integration

Combine HubSpot and GA4 data layers:

<script>
  // Initialize both data layers
  window.dataLayer = window.dataLayer || [];
  window._hsq = window._hsq || [];

  // Push HubSpot data to GA4 dataLayer
  _hsq.push(['addIdentityListener', function(hstc, hssc, hsfp) {
    dataLayer.push({
      'event': 'hubspot_identity',
      'hubspot_cookie': hstc,
      'visitor_token': hsfp
    });
  }]);
</script>

Campaign Tracking

Ensure UTM parameters are preserved:

<script>
  gtag('config', 'G-XXXXXXXXXX', {
    'campaign_source': '{{ contact.hs_analytics_source }}',
    'campaign_medium': '{{ contact.hs_analytics_source_data_1 }}',
    'campaign_name': '{{ contact.hs_analytics_source_data_2 }}'
  });
</script>
↑ Back to top
// SYS.FOOTER