How to set up Google Analytics in Bubble

Go to your Bubble editor, click Settings in the left sidebar, then click the SEO / metatags tab. Find the 'Script/meta tags in header' section. Paste the GA4 tracking script provided by Google Analytics. It looks like: a script tag loading gtag.js from googletagmanager.com with your Measurement ID, followed by a script block that initializes the gtag with your ID. This code loads on every page of your app, tracking all page views automatically.

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

Preview your Bubble app in a browser. Open Google Analytics 4 and go to Reports → Realtime. You should see at least one active user (yourself). If no data appears after a few minutes, check: is the Measurement ID correct, is the script in the Header section (not the Body), and are there any browser extensions blocking tracking (like ad blockers). You can also use the Google Tag Assistant Chrome extension to verify the tag is firing correctly. Wait up to 24 hours for data to appear in standard (non-realtime) GA4 reports.

In your Bubble workflows, you can fire custom GA4 events using the Run JavaScript action (found under Element Actions or via a JavaScript plugin). For example, when a user completes a signup, add a Run JavaScript action: gtag('event', 'sign_up', { method: 'email' }). For a purchase: gtag('event', 'purchase', { value: [order total], currency: 'USD', transaction_id: '[order id]' }). Add these JavaScript actions to the appropriate workflow triggers (button clicks, page loads, form submissions).

1// Sign up event
2gtag('event', 'sign_up', {
3  method: 'email'
4});
5
6// Purchase event  
7gtag('event', 'purchase', {
8  transaction_id: 'T12345',
9  value: 49.99,
10  currency: 'USD'
11});
12
13// Custom event
14gtag('event', 'feature_used', {
15  feature_name: 'dashboard_export'
16});

In GA4, go to Configure → Events. Find the custom events you created (sign_up, purchase, etc.). Click the toggle to mark them as conversions. Now these events appear in the Conversions report with counts and conversion rates. For e-commerce tracking, use GA4's recommended events (purchase, add_to_cart, begin_checkout) with the standard parameters so GA4 can build automatic e-commerce reports. Review conversions daily during the first week to ensure data is flowing correctly.

Bubble apps that use group-based navigation (showing/hiding groups instead of navigating to new pages) do not automatically trigger GA4 page views for virtual page changes. To fix this, add a Run JavaScript action in workflows that change the visible 'page': gtag('event', 'page_view', { page_title: 'Dashboard', page_location: window.location.href + '/dashboard' }). This sends a page_view event with a virtual URL so GA4 records the navigation even though the actual URL did not change.