How to Add Google Analytics 4 to Weebly | OpsBlu Docs

How to Add Google Analytics 4 to Weebly

Install GA4 on your Weebly website using the SEO settings panel or header code injection. Covers Measurement ID setup and page tracking.

For general GA4 concepts and features, see the Google Analytics 4 overview.

Prerequisites

  • Google Analytics 4 property created
  • GA4 Measurement ID (G-XXXXXXXXXX)
  • Weebly paid plan (Personal, Professional, or Performance)

Installation Methods

Method 1: Weebly Native Integration (Limited)

Weebly has a built-in Google Analytics integration, but it has limitations:

  1. Go to Settings > SEO
  2. Find Header Code section
  3. This method is actually manual code injection

Note: Weebly doesn't have a native GA4-specific integration field like some platforms. Use the Header Code method below.

This is the recommended method for GA4 installation on Weebly:

  1. Go to Settings > SEO
  2. Scroll to Header Code section
  3. Paste the Google Analytics 4 code:
<!-- 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');
</script>
  1. Replace G-XXXXXXXXXX with your actual Measurement ID
  2. Click Save
  3. Publish your site to apply changes

Method 3: Via Google Tag Manager

If you're using GTM (recommended for complex tracking):

  1. Install GTM first: GTM Setup for Weebly
  2. Add GA4 Configuration tag in GTM
  3. No additional Weebly configuration needed

Configuration

Enhanced Measurement

GA4's Enhanced Measurement automatically tracks:

  • Page views
  • Scrolls (90% depth)
  • Outbound link clicks
  • Site search (if enabled)
  • Video engagement (YouTube embeds)
  • File downloads

To enable/disable Enhanced Measurement:

  1. Go to GA4 Admin > Data Streams
  2. Click your web stream
  3. Toggle Enhanced Measurement settings

Ecommerce Tracking (Performance Plan)

For Weebly stores on the Performance plan:

// Add to Header Code after GA4 base code

// Track product views
document.addEventListener('DOMContentLoaded', function() {
  // Check if on product page
  var productName = document.querySelector('.wsite-com-product-title');
  var productPrice = document.querySelector('.wsite-com-product-price');

  if (productName && productPrice) {
    gtag('event', 'view_item', {
      currency: 'USD',
      value: parseFloat(productPrice.textContent.replace(/[^0-9.]/g, '')),
      items: [{
        item_name: productName.textContent.trim()
      }]
    });
  }
});

Note: Weebly ecommerce tracking is limited. Consider using Square's analytics for comprehensive ecommerce data.

Verification

Check Installation

  1. View Page Source: Right-click > View Page Source > Search for "gtag.js"
  2. GA4 Realtime Report: Check Admin > Reports > Realtime
  3. Google Tag Assistant: Use browser extension to verify

Common Issues

Code not appearing:

  • Ensure you're on a paid plan
  • Clear Weebly cache and republish
  • Check for syntax errors in code

Pageviews not tracking:

  • Verify Measurement ID is correct
  • Check for ad blockers
  • Confirm Enhanced Measurement is enabled

Data Layer Events

For custom event tracking, you can push events to the data layer:

// Track custom events
gtag('event', 'button_click', {
  'button_name': 'signup_cta',
  'page_location': window.location.href
});

Cross-Domain Tracking

If you have multiple domains (e.g., main site and blog):

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

Next Steps

Nach oben