How to Add Google Analytics to Webflow (Plus Fixes)

How to Add Google Analytics to Webflow

You add Google Analytics to Webflow by pasting your GA4 Measurement ID that starts with G- into Site settings > Integrations tab > Google Analytics and then publishing your site for tracking to go live. That native integration is how Webflow injects the gtag script across every page without custom code.

The friction usually starts right after you publish. You save the ID, hit Publish, open GA4 Realtime and see nothing, then wonder if you used the wrong property, an old UA- ID, or that webflow.io staging URL instead of your live domain. Webflow's own help center confirms the current field location as Site settings > Integrations tab > Google Analytics, with Measurement IDs that start with G-, GT-, AW-, or GTM- and are case sensitive.

This guide stays on the current GA4 path and flags where tracking quietly breaks. Later sections cover how to verify data beyond Realtime, why ad blockers and unpublished staging domains cause false negatives, and when to skip the native field entirely and route GA4 through Google Tag Manager for event or ecommerce tracking.

Step-by-Step: Connecting GA4 to Your Webflow Site

Adding Google Analytics 4 to Webflow means copying your web data stream's Measurement ID from Google Analytics and pasting it into Webflow's Site settings > Integrations > Google Analytics field, then publishing.

Part 1: Get your GA4 Measurement ID

If you don't have a GA4 property yet, create one at analytics.google.com. For an existing property:

1. Open your GA4 property and go to Admin. Under Data collection and modification, click Data streams.
2. Select the Web tab and click your web data stream. If you need to create one, choose Web, enter your domain, and create the stream.
3. In the stream details first row, copy your Measurement ID. Google documents the Measurement ID format as starting with 'G-', and it acts as the link between your site and that data stream.

Keep this ID handy. It is case sensitive and must be copied exactly.

Part 2: Paste it into Webflow and publish

1. In Webflow, open Site settings > Integrations tab > Google Analytics. This is the current path in Webflow's official help center; older tutorials show Apps & Integrations or a standalone Google Tag field. If you see Google Tag instead, you are on the newer label that accepts the same ID, and Webflow's help article now notes it accepts IDs starting with G-, GT-, AW-, or GTM-.
2. Paste your Measurement ID into the Measurement ID field.
3. Click Save changes.
4. Publish your site to the domains you want tracked. The integration only goes live after publish, and Webflow notes its integration uses Google Tag Gateway (GTG) to proxy tags server-side so traffic proxied through GTG doesn't count toward your site's bandwidth allocation.

Staging behavior: if you publish to both your webflow.io subdomain and your custom domain, both locations will send hits to the same Measurement ID when visited. That is useful for testing, but set your default domain in GA4 to your primary custom domain so reports stay consistent.

Part 3: Confirm data is flowing

Open your published site in a new tab, then in GA4 go to Reports > Realtime. You should see yourself as an active user within seconds. If nothing appears, double-check the published domain matches the tab you opened, you saved and published after pasting, and you didn't add the same tag in both Integrations and custom head code.

Native GA4 Integration vs. Google Tag Manager in Webflow

Native GA4 integration and Google Tag Manager both add GA4 tracking to Webflow, but native covers basic pageview and session reporting while Tag Manager is the path for custom events, ecommerce, and multiple marketing tags. Webflow's Google site tools app lets you connect all three Google services directly from the Apps panel. Getting the basic pixel firing is one thing; choosing the right tracking method for your actual needs is another.

Use native GA4 via the Google site tools app if your reporting stops at page views, sessions, traffic source, and the automatically collected events GA4 enables by default like scrolls and outbound clicks. Installation is selecting an Account and Property, publishing, and then removing any legacy Measurement ID left in Site Settings > Apps & Integrations > Google Analytics. Webflow notes that step avoids inflating site load times when you switch to the App.

Choose Tag Manager when you need to define what counts as a conversion or stack other pixels. Google's documentation states GA4 in Tag Manager is implemented by configuring a Google tag that loads the property, sets cookies, and sends automatically collected and enhanced measurement events. That container model lets you create separate GA4 event tags for form submissions, purchases, and custom click triggers, plus add Meta, LinkedIn, or other marketing tags without editing Webflow again. The Webflow entry point is the same App where you choose Tag Manager Account and Container and GA4 Account and Property, but all logic moves to Tag Manager: tag type Google Tag, Tag ID, trigger Initialization - All Pages, then Preview in Tag Assistant and Submit to publish.

In practice, start native if you only need traffic-level reporting, start GTM if you already know you need ecommerce, form tracking, or more than one ad pixel. Whichever method you choose, tracking can still fail silently, so it helps to know what to check.

Why Your Webflow Analytics Data Isn't Showing Up

Why is my Webflow site not showing any GA4 data after I published the ID? In most cases it's because the tag never fired on the live custom domain: blocked, cached, duplicated, or pointed at a dead UA property.

Choosing the right method doesn't guarantee it works on the first try. Several quiet failure points trip up otherwise correct setups. Here are the ones that generate the most follow-up tickets, with a quick check and fix for each.

1. You pasted a UA ID instead of a GA4 Measurement ID Old tutorials still show UA-XXXXXXX-X. Google Analytics 4 uses a Measurement ID that starts with 'G-'. Standard Universal Analytics properties stopped processing new hits and were fully shut down in July 2024, so a UA ID sends nothing. Check: In Webflow Settings > Apps & Integrations > Google Analytics, confirm the ID starts with G-. In GA, Admin > Data streams > Web stream shows the correct G- ID. Fix: Replace the UA- value with the G- ID and publish again.

Pasting an old Universal Analytics ID (UA-...) instead of a GA4 Measurement ID (G-...) is the most common silent failure. Webflow saves the UA- value without throwing an error, but GA4 will never receive the data.

2. You tested on the staging/webflow.io domain Webflow's Google Analytics field only injects on the published custom domain, not the Designer preview or the default.webflow.io staging URL unless you published there. Check: Open your live domain and hard refresh. Fix: Publish to the custom domain and test on that URL.

3. Ad blocker or privacy extension blocked GA Brave shields, uBlock, Ghostery, and similar tools block googletagmanager.com and google-analytics.com by default, so your own visits never reach GA. Check: Disable extensions or test in an incognito window without them, then open DevTools > Network and filter for collect or g/collect. Fix: Confirm hits appear when blockers are off. Ask a colleague without blockers to visit, or rely on other users' data.

4. Browser or cache served an old page If you checked right after publishing, your CDN or browser may still serve the pre-tag HTML. Check: View source on the live site and search for your G- ID. Fix: Hard refresh (Cmd+Shift+R / Ctrl+F5) and clear Webflow hosting cache if you use Cloudflare or similar.

5. Duplicate tag: GA added natively AND via GTM Adding the same G- ID in Webflow's native field and again in Google Tag Manager fires two pageviews per load and can corrupt session counts. Check: In source, look for two gtag snippets with the same G- ID. Fix: Keep one method. If you use GTM for events, remove the ID from the native Webflow field and manage GA4 only through GTM, then publish.

Cookie Consent and Privacy Compliance for Webflow Analytics

The biggest compliance mistake on Webflow is firing GA4 before asking. Under EU ePrivacy and GDPR rules, Google Analytics cookies like _ga are analytics cookies that require prior, freely given consent when you serve visitors in the EU, UK, or EEA, so your GA4 tag must stay blocked until a visitor actively accepts analytics.

Webflow does not ship with built-in consent management. If you paste a Measurement ID into the native integrations panel, that script loads on every page view with no gate. To comply, you have to add a consent management platform (CMP) via custom code and configure it to block non-essential cookies. That pattern requires prior consent before storing or accessing information on a device unless the cookie is strictly necessary, and analytics never qualifies as strictly necessary.

The fix is to remove GA4 from Webflow's native panel and load it through the CMP, so it only fires after the statistics consent category is granted. Consent under Article 7 must be freely given, specific, informed, and unambiguous, which means equal accept and reject options on the first layer and a link to a dedicated cookie policy. You install the consent script in Webflow's Head Code as the first item, so it initializes before any tracking, then set your CMP to data-blockingmode="auto" or manual text/plain blocking.

Use this quick compliance setup template to apply it:

This is not legal advice, but with blocking in place you avoid the most common enforcement trigger. With tracking correctly and compliantly in place, the real payoff is what you do with the data.

Putting Your Webflow Analytics to Work

Your Webflow site's GA4 data stays explorable in Explorations for a default retention window, with the option to raise retention on free properties, after which user-level history is automatically deleted on a monthly basis.

Set a 15-minute weekly routine in GA4:

• Traffic acquisition: In Reports > Acquisition > Traffic acquisition, review Session source / medium to see which channels drove engaged sessions in the last 7 days, not just clicks.
• Top landing pages: In Reports > Engagement > Landing page, sort by views and average engagement time to spot which Webflow pages hold attention and which lose it in under 10 seconds.
• Conversions if configured: In Reports > Engagement > Conversions / Key events, track week-over-week completions and where drop-off begins.

That loop tells you what to keep, fix, or expand. Analytics proves whether the pages, campaigns, and offers you already published are working. It does not create the next page to measure.

Once analytics are dependable, the bottleneck usually shifts to publishing cadence. Teams need a sustainable way to keep shipping content worth tracking. HarperFlow automates researching, writing, and publishing citation-ready articles directly to Webflow, so you can pair a working measurement setup with a steady pipeline of content to measure.