On Fimo (fimo.ai), there is no "custom code" field to fill in: your site is real code, in a repository you control. The FlowConsent snippet therefore goes at the very top of the root layout's <head>, either by asking the Fimo Studio chat or with your coding agent, and then you publish. The main pitfall: Fimo sites run on frameworks that change pages without a full reload, so you need to turn on the banner's SPA Mode.
Before you start
- An account on app.flowconsent.com (free Free plan, no credit card, 25,000 sessions per month) and a banner that is created and deployed. On the Free plan, deployment runs through your own Cloudflare account (guide); on Pro and Enterprise it is one click.
- A Fimo project you can edit and publish. Fimo creates sites with Next.js (the default), React Router, Vite + React, Astro or SvelteKit, and can host other applications.
Step 1: Copy the snippet
In FlowConsent, open Builder → Deployment → Integration, HTML / No-code tab (or Next.js if your Fimo site uses Next.js). The snippet has two parts, and their order matters:
<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>The first block sets the Consent Mode v2 defaults (everything denied), the second loads the banner. Both must come before any tracking script.
Step 2: Add it to the root layout
Fimo's documentation does not describe a custom code menu in Studio: the <head> lives in your site's code. There are two ways to do it.
With the Fimo Studio chat (the simplest). Open your project's chat and describe the outcome you want, pasting the snippet:
Add this snippet at the very top of the root layout's
<head>, before any other script, on every page, without modifying the code: [FlowConsent snippet]
The chat prepares the change and leaves it for review: use View changes to check that the snippet is the first element of the <head>, and Open preview to see it in a preview.
With your coding agent or by hand. The file depends on the framework:
| Framework | Where to put the snippet |
|---|---|
| Next.js | The root layout (app/layout.tsx), see the Next.js guide |
| Astro | The layout that renders the <head> (src/layouts/Base.astro in new Fimo projects), with is:inline on both <script> tags so Astro does not bundle them |
| SvelteKit | src/app.html, at the top of the <head>, before %sveltekit.head% |
| Vite + React | index.html at the project root |
| React Router | The component that renders the <head> in app/root.tsx |
Then fimo deploy updates the current Branch's Preview, without publishing anything.
Step 3: Publish
Saved changes do not update the public site. Once the change is merged into the production Branch (main by default), select Publish at the top right of the project header, then Publish in the panel. From the terminal: fimo checkout main, then fimo deploy --publish.
Fimo-specific pitfalls
- Preview and production are separate. Preview is for review among project members, it is not your public site. Run your final checks on the published address.
- Other trackers come after. If the code loads Google Analytics, the Meta Pixel or Google Tag Manager, they must come after the snippet. The safest option: remove them from the code and declare them in Builder → Services, so the banner only loads them after consent.
- Security headers. Fimo lets you set HTTP headers in
.fimo/config.json. If you add a Content Security Policy there, allow your FlowConsent banner's domain, or the browser will block it.
Verify the installation
- Open your published site in a private window: the banner should appear.
- In the Network tab of the developer tools, no third-party request should leave before you click "Accept".
- Run the installation assistant (Builder → Integration): it checks the live page (loader present with your license code, Consent Mode stub present, stub placed BEFORE every Google tag). See the setup wizard.
- Finish with a refusal scan from the Compliance tab: a real browser refuses consent and confirms that nothing fires. See compliance verification.
Do it from your AI agent (MCP)
FlowConsent has an official MCP server, https://mcp.flowconsent.com, that works from Claude, ChatGPT or any MCP client. You connect with OAuth 2.0 using your FlowConsent account, no API key needed. Your agent can fetch the snippet and placement instructions (get_banner_snippet and get_setup_instructions tools), verify the installation with a real scan (verify_consent_compliance) and set up recurring monitoring (monitor_compliance).
Example request:
Give me my banner snippet for my Fimo site and check that it is installed correctly on https://mysite.com
The FlowConsent MCP server does not edit your site: it provides the snippet, the instructions and the verification. You, your coding agent or the Fimo chat add the snippet to the layout. See the MCP server and the MCP page.
Frequently asked questions
Does Fimo have a field for pasting code into the <head>?
Fimo's documentation does not describe one: Studio settings cover things like SEO and domains, while the <head> is part of your site's code. You add the snippet to the root layout, through the Studio chat or your coding agent.
Should I load FlowConsent through Google Tag Manager?
No. FlowConsent does not load through GTM, because a banner loaded from GTM arrives too late for prior blocking. The snippet goes at the top of the <head>, above the GTM container. See Google Consent Mode.
Can a Fimo agent remove the snippet by mistake?
Fimo agents work in Branches and present their changes for review before merge. Read the diffs that touch the root layout, and let FlowConsent monitoring (monitor_compliance) flag any regression.