How to Set Up Google Tag Manager on a Webflow Nonprofit Website
Google Tag Manager Setup for Webflow Nonprofits: A Practical Guide
What Google Tag Manager Is and Why It Matters
Every time you add a tracking tool to your website — Google Analytics, Meta Pixel, LinkedIn Insight Tag, a live chat widget, a conversion tracking script — that tool requires a piece of JavaScript to be placed on your site. Without a tag manager, each of these scripts is added directly to the site's code. Adding, updating, or removing them requires a developer to touch the codebase every time.
Google Tag Manager (GTM) changes that. It acts as a container — a single script added to your site once, through which all other tracking tags are deployed and managed. Once GTM is installed, a digital marketer or analyst can add, configure, or remove tracking tags through GTM's interface without touching the site's code.
For nonprofits, this matters for two reasons. First, it separates marketing and analytics configuration from website development — your Communications team or a digital marketing partner can manage tracking without needing developer access to the site. Second, it's the correct architecture for GDPR-compliant consent management, which is covered in detail in How to Set Up CookieYes and Google Consent Mode V2 on a Webflow Nonprofit Website.
This guide covers installing GTM on Webflow, setting up a GA4 tag, and understanding what GTM is and isn't the right tool for.
Before You Start
What you need:
- A Google account with access to create a GTM container
- A Webflow site on a paid hosting plan
- Admin access to the Webflow site
- A GA4 property already created in Google Analytics
A note on sequencing: If you're also setting up CookieYes and Google Consent Mode V2 — which you should be if your site collects any personal data — read this guide first to understand GTM installation, then follow the CookieYes guide for the full consent configuration. The two setups overlap: GTM is installed in this guide, and consent tags are configured in R-05.
Step 1: Create a GTM Account and Container
Go to tagmanager.google.com and sign in with your Google account.
If this is your first GTM account, you'll be prompted to create one. If you already have a GTM account (for another site or organisation), you can add a new container to the existing account.
Create a new container:
- In GTM, select Create Account or navigate to your existing account and select Create Container
- Enter the container name — use the site's domain name for clarity (e.g.
yourcharity.org.uk) - Set the target platform to Web
- Click Create
GTM will display the container's installation code — two snippets of JavaScript, one for the <head> and one immediately after the opening <body> tag.
Screenshot placement: [Screenshot showing the GTM container creation screen with the container name field and Web platform option selected]
Step 2: Install GTM on the Webflow Site
In Webflow, navigate to your site's settings. Look for the Custom Code section — this is where site-wide code is added to every page.
Add the two GTM snippets:
- Head Code field — paste the GTM
<head>snippet here. This is the primary GTM script that loads the tag manager. - Footer Code field — paste the GTM
<body>snippet here. This is a fallback for browsers with JavaScript disabled.
Save the settings and publish the Webflow site. GTM will not be active on the live site until the site is published — changes to Custom Code in Webflow require a site publish to take effect.
Screenshot placement: [Screenshot showing Webflow's Custom Code settings panel with the GTM head snippet in the Head Code field and the body snippet in the Footer Code field]
Verify the installation:
In GTM, use the Preview button (the debug icon in the top right of the GTM interface) to open Tag Assistant. Enter your site's URL and connect. Tag Assistant will confirm whether GTM is firing on the page. If it connects successfully, GTM is installed correctly.
Screenshot placement: [Screenshot showing GTM Preview Mode connecting to a site URL with a successful connection confirmed]
Step 3: Publish the GTM Container
GTM has its own publishing step separate from Webflow. Adding a tag in GTM doesn't make it live until the GTM container is published.
After any change in GTM — adding a tag, modifying a trigger, updating a variable — you must:
- Click Submit in the top right of GTM
- Add a version name and description (e.g. "Initial setup — GA4 and consent defaults")
- Click Publish
This creates a versioned snapshot of your container configuration. GTM maintains a full history of published versions, which means any change can be rolled back if something goes wrong. Get into the habit of writing descriptive version names — they make debugging much easier later.
Screenshot placement: [Screenshot showing GTM's Submit/Publish panel with a version name entered and the Publish button visible]
Step 4: Install GA4 via GTM
With GTM installed and the consent defaults configured (see R-05 for the consent setup), add the GA4 configuration tag:
- In GTM, go to Tags → New
- Select Google Analytics: GA4 Configuration as the tag type
- Enter your Measurement ID — found in your GA4 property settings under Data Streams. Format:
G-XXXXXXXXXX - Set the trigger to All Pages
- In Advanced Settings → Consent Settings, enable the consent check for
analytics_storage— this ensures the tag respects the consent defaults set in R-05 - Name the tag clearly (e.g. "GA4 — Configuration Tag")
- Save and publish the container
Screenshot placement: [Screenshot showing the GA4 Configuration tag setup in GTM with the Measurement ID field, All Pages trigger, and consent check settings visible]
Verify GA4 is receiving data:
Open GTM Preview Mode, connect to your site, and navigate a few pages. Then open your GA4 property and check the Realtime report. You should see active users appearing within a minute or two of browsing the site in Preview Mode.
If GA4 is not receiving data, check: Is the Measurement ID correct? Is the GTM container published? Is the consent default blocking GA4 before consent is granted in testing?
Step 5: Add Meta Pixel and LinkedIn Insight Tag (If Applicable)
These tags are only relevant if your organisation runs advertising on Meta (Facebook and Instagram) or LinkedIn. If you don't currently run paid advertising, skip this step — you can add these tags later when needed without changing anything else.
Meta Pixel:
- In GTM, go to Tags → New
- Search the Community Template Gallery for Meta Pixel or add a Custom HTML tag with the Pixel base code from your Meta Events Manager
- Set the trigger to All Pages
- In consent settings, require
ad_storageandad_user_databefore the tag fires - Save and publish
LinkedIn Insight Tag:
- In GTM, search the Community Template Gallery for LinkedIn Insight Tag
- Enter your LinkedIn Partner ID (found in LinkedIn Campaign Manager under Account Assets → Insight Tag)
- Set the trigger to All Pages
- Require
ad_storageconsent before firing - Save and publish
Both tags should only fire after a user has accepted advertising cookies in the CookieYes banner. Verify this using the browser Network tab method described in R-05.
What GTM Is Not the Right Tool For
GTM is excellent for deploying and managing third-party tags. It is not a substitute for dedicated analytics expertise, and the more advanced tracking configurations — scroll depth events, form submission tracking, button click events, e-commerce conversion tracking — require someone with GTM and analytics experience to configure correctly. In my work with nonprofits, I install GTM and configure GA4 and consent tags, but I'm explicit with clients that advanced event tracking is a separate engagement — one that sits with a digital marketer or analytics specialist, not a Webflow consultant.
For most nonprofit Communications Directors and Digital Managers, the setup described in this guide covers what you need: GA4 collecting baseline data, advertising tags deployed correctly with consent, and a container structure that a digital marketing partner can build on if your organisation runs campaigns.
Advanced event tracking — knowing exactly which content users engage with, which donation amounts are selected, which pages cause drop-off — is genuinely valuable but varies significantly by organisation. If your organisation has a digital marketer or works with a marketing agency, GTM gives them the infrastructure to configure this without needing access to the Webflow site itself. That separation is the point.
When Webflow Analyse Is Enough
Not every nonprofit needs the full GTM and GA4 stack. For organisations that don't run paid advertising, don't need granular event tracking, and primarily want to understand traffic patterns and content performance, Webflow Analyse may be sufficient.
Webflow Analyse is built into the Webflow platform and available as a paid add-on. It provides:
- Page views and unique visitors — clean traffic data without sampling
- Traffic sources — where visitors come from (direct, search, referral, social)
- Top pages — which content gets the most traffic
- Scroll depth — how far down each page visitors scroll, without additional configuration
- Heatmaps — where visitors click and move on each page, built in without a separate tool like Hotjar or Microsoft Clarity
Scroll depth and heatmaps in particular are features that many organisations pay for through separate tools (Hotjar starts at around £30/month). Having them built into Webflow Analyse removes that cost and that integration.
The limitation is that Webflow Analyse doesn't integrate with Google's advertising ecosystem — it can't feed conversion data back to Google Ads or Meta. If you run paid campaigns and want to measure their effectiveness, GA4 via GTM remains necessary alongside or instead of Webflow Analyse.
For nonprofits deciding between the two: if you run advertising or need to report analytics data to funders in GA4 format, use GA4 via GTM. If you primarily want to understand how your content performs and don't run paid campaigns, Webflow Analyse is simpler to maintain and gives you scroll depth and heatmaps without additional tools. For most of my clients who aren't running paid campaigns, I recommend starting with Webflow Analyse — it's one less system to manage, and the data it provides is sufficient for quarterly content reviews.
A Note on Data Ownership
One practical detail worth noting: GA4 data is stored in Google's infrastructure and owned by Google under their terms of service. You have access to it, but you don't own it in the way you own your Webflow site or your CMS content.
Webflow Analyse data is associated with your Webflow account. This is a different ownership structure, though similarly dependent on a platform relationship.
For nonprofits with specific data governance requirements — organisations handling sensitive beneficiary data, those subject to funder data requirements, or those with Board-level digital governance policies — the data residency question is worth raising with your IT adviser or Data Protection Officer. For most nonprofits, GA4's standard terms are acceptable, but it's a decision that should be made consciously rather than by default.
Further Reading
Eric Phung has 7 years of Webflow development experience, having built 100+ websites across industries including SaaS, e-commerce, professional services, and nonprofits. He specialises in nonprofit website migrations using the Lumos accessibility framework (v2.2.0+) with a focus on editorial independence and WCAG AA compliance. Current clients include WHO Foundation, Do Good Daniels Family Foundation, and Territorio de Zaguates. Based in Manchester, UK, Eric focuses exclusively on helping established nonprofits migrate from WordPress and Wix to maintainable Webflow infrastructure.
Not sure where your site currently stands?
A Blueprint Audit tells you exactly what needs to change — and why.
Before implementing anything new, it's worth knowing what your current site is and isn't doing for your stakeholders. The Blueprint Audit gives you that clarity in two to three weeks.
Related Resources
Using AI Tools for Nonprofit Website Content: A Practical Guide
A practical guide to using AI writing tools on nonprofit website content — what they're genuinely useful for, where human review is non-negotiable, and the governance questions your organisation needs to answer before using them.
Accessibility Statement Template for Nonprofit Websites
A ready-to-use accessibility statement template for nonprofit and charity websites — including what to include, how to structure it, and how to keep it current.
Website Performance Monitoring for Nonprofits: Metrics That Matter
A practical guide to website performance monitoring for nonprofit organisations — covering which metrics to track, which tools to use, and how to build a sustainable quarterly review cadence.
Join our newsletter
Subscribe to my newsletter to receive latest news & updates
