Install FlowConsent on Netlify

On Netlify, the FlowConsent snippet is best placed at the very top of the <head> in your site's code, followed by a redeploy. Netlify also offers Snippet injection (Project configuration → Developer settings → Post processing), with no code change and no redeploy. The trap: it inserts the snippet just before </head>, so after any scripts already in the <head>, and it does not apply to server-rendered pages.

Before you start

• An account on app.flowconsent.com (free Free plan, no credit card, up to 25,000 sessions per month).
• A banner created and deployed. On the Free plan, deployment goes through your own Cloudflare account (Cloudflare guide); on Pro and Enterprise it takes one click.
• Access to the site's code, or to the project's Netlify dashboard.

Step 1: Copy the snippet

Open Builder → Deployment → Integration and copy the snippet (HTML / No-code tab, or Next.js for a Next.js app). It has two parts, in this order:

<script>
// FlowConsent Loader - place BEFORE any other script in the <head>
window.dataLayer=window.dataLayer||[];
function gtag(){dataLayer.push(arguments);}
gtag('consent','default',{
  'ad_storage':'denied',
  'analytics_storage':'denied',
  'ad_user_data':'denied',
  'ad_personalization':'denied',
  'wait_for_update':500
});
gtag('set','url_passthrough',true);
gtag('set','ads_data_redaction',true);
</script>
<!-- FlowConsent CMP -->
<script src="https://YOUR-LICENSE-CODE.consent.flowconsent.com/cookie-manager.js?code=YOUR_LICENSE_CODE"></script>

Step 2 (recommended): Paste it into your site's code

Paste the snippet right after the opening <head> tag, before any other script, in the file that produces the <head> for all your pages:

• Static HTML site: every HTML page, or your generator's shared template (Hugo, Eleventy, Jekyll…).
• Next.js: app/layout.tsx or pages/_document.tsx, see the Next.js and React SPA guide.
• Astro: the base layout, with is:inline, see Install on Astro.
• React (Vite, Create React App): index.html, see Install on React.

Then push the change: Netlify rebuilds and publishes the site. This is the only method that guarantees the snippet sits at the top of the <head>, and it also works on server-rendered pages.

No-code alternative: Snippet injection

If you cannot touch the code, Netlify can inject the snippet into every page it serves:

1. In the Netlify UI, go to Project configuration → Developer settings → Post processing.
2. In the Snippet Injection section, select Add Snippet.
3. Choose to inject before the closing </head> tag, give the snippet a name (for example FlowConsent) and paste the full snippet, <script> tags included.
4. Select Save.

According to Netlify's documentation, the snippet is injected immediately, with no redeploy needed.

Other limits documented by Netlify: injection happens when pages are served, and it does not work on proxy routes or on routes handled by functions. Server-rendered (SSR) pages, which run on Netlify Functions, therefore do not get the snippet. For a Next.js, Astro or other SSR site, use the code method.

Tracking scripts and single-page apps

Do not leave any tracker hard-coded in the <head>: declare Google Analytics, Meta Pixel and other services in Builder → Services, and the banner loads them only after consent. With Google Tag Manager, the snippet goes above the GTM container, never inside GTM (Google Consent Mode guide).

If your site navigates without reloading the page (React, Next.js, Vue, Astro with <ClientRouter />), turn on SPA mode in the Builder's Settings tab and redeploy the banner.

Verify the installation

1. Open the published site in a private window: the banner appears.
2. View the page source: the snippet appears before any other script in the <head>.
3. In the Network tab, no third-party request goes out before Accept.
4. Run the setup wizard (Builder → Integration): loader present with the right license code, Consent Mode stub present and placed before every Google tag.
5. Finish with a refusal scan from the Compliance tab (compliance verification).

Do it from your AI agent (MCP)

FlowConsent has an official MCP server, https://mcp.flowconsent.com, usable from Claude, ChatGPT or any MCP client, with an OAuth 2.0 connection to your FlowConsent account (no API key). The agent fetches the snippet and placement instructions (get_banner_snippet, get_setup_instructions), verifies the installation with a real scan (verify_consent_compliance) and can set up recurring monitoring (monitor_compliance). It does not configure Netlify for you.

Give me my banner's snippet for my site hosted on Netlify and check that it is installed correctly on https://mysite.com

Learn more: MCP server and FlowConsent for AI agents.

Frequently asked questions

Snippet injection or site code: which should I choose?

The site's code, whenever possible: the snippet sits at the top of the <head> and works on every page, SSR included. Snippet injection suits a static site whose <head> contains no tracking script.

The banner is missing on some pages. Why?

Those pages are probably rendered by a function (SSR) or served through a proxy: Snippet injection does not apply there. Put the snippet in your framework's layout.

Does the snippet also show on Deploy Previews?

Yes, Snippet injection applies to pages served by Netlify, previews included. Still, keep the setup wizard and the refusal scan for your production domain.

Do I need to redeploy after a Snippet injection?

No, Netlify applies it immediately. A change in the code, however, requires a new deploy.