To add Google Analytics to a Framer site, create a Google Analytics 4 property, copy its Measurement ID that starts with G, and paste the GA4 tag into Framer under Site Settings, in the Custom Code section’s End of head tag field. Publish the site, and Framer loads the tag on every page so Google Analytics begins tracking visitors immediately.
Analytics turns a website from a guess into a measured asset. Without it, you have no idea which pages convert, where traffic comes from, or whether a redesign helped. Framer makes installation straightforward because it gives you a dedicated place to inject tracking code that loads sitewide, so you set it up once and every page is covered.
This guide walks through creating the GA4 property, installing the tag in Framer the correct way, verifying it works, tracking button and form events, and respecting privacy regulations along the way.
Key takeaways
- Google Analytics 4 is installed in Framer by pasting the GA4 tag into Site Settings, under Custom Code, in the End of head tag field.
- You need a Google Analytics 4 property and its Measurement ID, which starts with the letter G followed by numbers.
- Installing in the site-wide head field means the tag loads on every page, so you do not add it page by page.
- Verify the install with the GA4 Realtime report or the Google Tag Assistant before trusting the data.
- Custom events, such as button clicks and form submissions, give you conversion data that page views alone cannot.
Step 1: Create your Google Analytics 4 property
Before touching Framer, you need a place for the data to land. If you already have a Google Analytics account, you only need to add a new property. If not, create the account first.
- Go to analytics.google.com and sign in with your Google account.
- Open Admin, then create a new account named after your business, then create a property under it, also named after your site.
- Set your reporting time zone and currency during property setup.
- Create a web data stream and enter your site’s full domain as the stream URL.
- Google generates a Measurement ID that looks like G followed by a string of characters. Copy it, and also copy the full Google tag snippet shown on the stream details page.
A clean account structure matters. Give each website its own property so the data never mixes. Naming the account and property after the business keeps your Google Analytics dashboard organized once you manage more than one site.
Step 2: Install the GA4 tag in Framer
Framer provides a custom code area built for exactly this. The Google tag belongs in the head, so it loads as early as possible and captures the page view.
- Open your project in Framer and go to Site Settings.
- Select the General tab and scroll to the Custom Code section.
- Paste your full Google tag snippet into the End of head tag field.
- Save the settings.
- Publish or republish the site, since custom code only goes live on a fresh publish.
The reason the head field matters is timing. Code in the head runs before the page body renders, so the Google tag initializes and records the page view at the earliest possible moment. Pasting it into the body field instead can delay or miss the initial measurement on fast page loads.
Site-wide versus per-page code
Framer offers custom code at both the site level and the individual page level. For analytics, always use the site-level field under Site Settings. That single placement covers every current and future page automatically. Per-page code is reserved for scripts that should only run on one specific page, which is rarely the case for general analytics.
Step 3: Verify the installation
Never assume tracking works. A typo in the Measurement ID or a forgotten republish are common reasons data never arrives. Verify before you rely on the numbers.
Use the Realtime report
Open your published site in a browser, then in Google Analytics go to Reports and open Realtime. Within a few seconds you should see at least one active user, yourself. If you appear, the tag is firing and sending data correctly.
Use Google Tag Assistant
For a deeper check, Google Tag Assistant connects to your live site and confirms the tag is present, fires correctly, and reports the right Measurement ID. This catches subtle issues such as a duplicate tag or a mismatched ID that the Realtime report alone might not reveal.
| Symptom | Likely cause | Fix |
|---|---|---|
| No data in Realtime | Site not republished after adding code | Republish the Framer site |
| No data in Realtime | Measurement ID typo | Recopy the ID from the GA4 stream |
| Data appears doubled | Tag installed twice | Remove the duplicate snippet |
| Events missing | Custom events not configured | Add event tracking, see step 4 |
Step 4: Track buttons, forms, and conversions
Page views tell you what people look at, but conversions tell you what they do. Google Analytics 4 is event-based, which means you can record specific actions such as a button click, a form submission, or an outbound link.
Built-in enhanced measurement
GA4 enables enhanced measurement by default, which automatically tracks scrolls, outbound clicks, site search, and file downloads without any extra code. Confirm it is on in your web data stream settings. For many Framer marketing sites, this covers a useful baseline before you add anything custom.
Custom events for key actions
For actions that matter most, such as a Book a Call button or a contact form submission, you want explicit events. In Framer you can attach a small snippet that fires a GA4 event when the element is interacted with, then mark that event as a conversion inside Google Analytics. This is what lets you measure cost per lead and conversion rate rather than raw traffic. If you would rather avoid hand-written snippets, several tools in our roundup of the best Framer plugins simplify event tracking and tag management inside the editor.
Connecting Google Analytics to the rest of your stack
Analytics rarely lives alone. Two connections deliver outsized value for most sites.
Google Search Console
Linking Google Search Console to your GA4 property brings organic search query data into your analytics reports. You see which search terms bring visitors, their click-through rate, and average position, alongside what those visitors do on the site. For any site that cares about organic traffic, this link is essential.
Google Ads
If you run paid campaigns, linking Google Ads to GA4 lets you import conversions and measure return on ad spend with real on-site behavior rather than ad-platform numbers alone. The conversions you defined in step 4 become the events you optimize campaigns against.
Privacy, consent, and compliance
Tracking visitors carries legal obligations that vary by region. In the European Union, the United Kingdom, and several other jurisdictions, you generally need visitor consent before loading analytics that use cookies. Ignoring this exposes your business to penalties.
Practical compliance steps
- Add a consent banner so visitors can accept or decline analytics cookies, and gate the Google tag on consent where required.
- Enable IP anonymization, which GA4 applies by default, so you do not store full visitor IP addresses.
- Publish a clear privacy policy that names Google Analytics and explains what you collect and why.
- Set a sensible data retention period in your GA4 property settings rather than keeping data indefinitely.
A consent management tool integrates with the Google tag’s consent mode so analytics only fully fires when a visitor agrees. Building this in from the start is far easier than retrofitting it after launch.
Choosing the right starting point for your site
Analytics is most useful on a site that is already structured to convert, with clear calls to action and pages worth measuring. If you are building from a template rather than a blank canvas, picking one designed for your use case saves time and gives you sensible sections to track from day one. Our roundups of the best Framer templates for an agency and the best Framer templates for consultants include layouts with conversion-focused sections that pair naturally with the event tracking described above.
Frequently Asked Questions
Where do I paste the Google Analytics code in Framer?
Paste the Google Analytics 4 tag into Site Settings, in the Custom Code section, specifically in the End of head tag field. This is the site-level setting, so the tag loads on every page automatically. After pasting and saving, you must republish the site, because custom code only takes effect on a fresh publish.
Why is Google Analytics not showing any data for my Framer site?
The most common cause is forgetting to republish after adding the code, since custom code only goes live on a new publish. The next most common cause is a typo in the Measurement ID. Recopy the ID directly from your GA4 web data stream, confirm the tag is in the End of head tag field, republish, then check the Realtime report to confirm data is arriving.
Can I track button clicks and form submissions in Framer?
Yes. Google Analytics 4 is event-based. Enhanced measurement automatically tracks scrolls, outbound clicks, and downloads. For specific actions like a Book a Call button or a contact form, you attach a small snippet that fires a GA4 event, then mark that event as a conversion inside Google Analytics so you can measure conversion rate and cost per lead.
Do I need a cookie consent banner with Google Analytics on Framer?
In the European Union, the United Kingdom, and several other regions, you generally need visitor consent before loading analytics cookies. Add a consent banner, gate the Google tag on consent where required, enable IP anonymization, and publish a privacy policy that names Google Analytics. Building consent in from the start is much easier than adding it after launch.
If you want a Framer site that is built to convert and instrumented to prove it, our team designs and ships sites exclusively in Framer with analytics configured from day one. See what that looks like on our pricing page or reach out through our contact page.