# Install FlowConsent on Netlify

Install FlowConsent on Netlify: paste the snippet at the top of the <head> in your site's code, or use Snippet injection if no other script comes first.

> Canonical: https://www.flowconsent.com/en/doc/install-netlify
> Last updated: 2026-10-01
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](https://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](/en/doc/cloudflare-deployment)); 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:

```html title="FlowConsent snippet"
<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](/en/doc/nextjs-integration).
- **Astro**: the base layout, with `is:inline`, see [Install on Astro](/en/doc/install-astro).
- **React (Vite, Create React App)**: `index.html`, see [Install on React](/en/doc/install-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.

> [!WARNING]
> Snippet injection puts the snippet **at the end of the `<head>`**, not at the start. Any tracking script already in your pages' `<head>` (Google Analytics, Meta Pixel, Google Tag Manager container…) therefore ends up **above** FlowConsent and fires before the visitor chooses. Only use this method if your site's `<head>` contains no tracking script; otherwise, paste the snippet into the code (step 2).

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](/en/doc/google-consent-mode)).

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](/en/doc/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](/en/doc/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](/en/doc/mcp-server) and [FlowConsent for AI agents](/en/mcp).

## 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.
