Platform guides

Framer cookie banner: how to set up GDPR cookie consent (2026)

Article contents

Framer makes it easy to ship a polished site in a day. It also makes it easy to paste a tracking script into Custom Code and forget it. This guide explains when a Framer site needs a banner, which tool controls what, and how to install and test a banner that actually blocks scripts before consent. Framer belongs to the same family as Webflow, Wix and Squarespace: our Webflow cookie consent guide is the hub of this platform series and covers the shared principles in more depth.

The rule does not depend on the site builder. Article 5(3) of the ePrivacy Directive requires prior consent before storing or reading information on a visitor's device, unless it is strictly necessary for the service the visitor asked for. When that information is linked to a person, the GDPR adds its own conditions: consent must be free, specific, informed and unambiguous, and as easy to withdraw as to give.

On a bare Framer site, that often means no banner at all. According to Framer, its built-in analytics (Framer Analytics) do not use cookies, so they do not need consent. A session cookie for a password-protected page or a load balancer cookie also stays exempt, as our guide to strictly necessary cookies explains. The reasoning is the same as for a Webflow site without Analytics: no optional tracker, no consent to collect.

The picture changes as soon as you add one of these:

  • Google Analytics 4, Google Ads or Google Tag Manager tags;
  • a Meta, LinkedIn or TikTok pixel;
  • embedded YouTube or Vimeo videos, Google Maps, Calendly or HubSpot forms;
  • a chat widget such as Intercom or Crisp;
  • heatmap or session recording tools such as Hotjar or Microsoft Clarity.

Each of them sets or reads identifiers in the browser. From that point, you need a banner that asks first and blocks until the answer is yes.

Where trackers come from on a Framer site

Before choosing a tool, list what your site really loads. On Framer, trackers usually enter through four doors:

  1. Project Settings → Custom Code, where most people paste GA4, GTM or pixel snippets, at the start or end of the <head> or <body>.
  2. Page-level custom code, which is easy to forget because it only lives on one page.
  3. Embed components, such as a YouTube video, a map or a booking widget, which load third-party scripts and cookies on their own.
  4. Marketplace components and plugins, which may call external services.

The quickest way to check is to open the published site in a private window and read the cookies in your browser's developer tools, as shown in our guide on how to check cookies on a website. Anything you see before clicking a banner is a problem.

Framer's built-in Cookie Banner component

Framer offers a free Cookie Banner component that you place in a shared component, such as the navigation, so it appears on every page. It is built around Google Tag Manager: you paste your GTM container ID in the properties panel, and the visitor's choices are passed to Google Consent Mode. The categories shown to visitors (Necessary, Preferences, Analytics, Marketing) are mapped to Google's consent types. You can set different behaviour for the EU and the rest of the world, choose default consent, and show a trigger that lets visitors reopen the banner.

Its limit is structural: it only governs what runs through GTM. A GA4 snippet pasted in Custom Code, a YouTube embed or a HubSpot form loads regardless of the visitor's answer. Framer does not present it as a cookie scanner or a consent log either, so you have nothing to export if a regulator asks for proof of consent.

A plugin from the Framer Marketplace

The Marketplace lists consent plugins, such as Consentful or Cookie PRO, that install a banner from the Framer editor. Some of them block scripts until opt-in and send Consent Mode v2 signals. Their features, pricing and storage of consent records vary widely, so read each listing carefully and check what happens to scripts outside the plugin's control.

A consent management platform installed through custom code

A consent management platform (CMP) is a dedicated tool that you load with a short snippet placed first in the <head>. CookieYes, Cookiebot, CookieChimp and FlowConsent all document a Framer installation. A CMP generally scans the site for cookies, blocks scripts by category until consent, sends Consent Mode v2 signals and keeps a record of each choice. It is the right fit when you use several tools outside GTM, run a multilingual site or need proof of consent.

Which option should you choose?

If everything already runs through GTM and you only need Google tags, the built-in component can be enough, provided you remove every script from Custom Code. If you embed videos, forms or chat widgets, or if you want a consent log, choose a CMP. Price is often the deciding factor: compare the cost of your current CMP with our calculator, and see how the main tools stack up on our comparison pages, for example CookieYes vs FlowConsent.

These steps assume a CMP installed through custom code. FlowConsent is a concrete example: its Framer snippet has two parts, a block that sets every Google consent signal to denied by default, then the script that loads the banner.

Step 1: list every tracker

Write down every script in Project Settings → Custom Code, every page-level script and every embed. For each one, note its purpose (analytics, marketing, functional) and whether it truly needs consent.

Step 2: take tracking scripts out of Custom Code

GA4, GTM and pixel snippets pasted directly in Custom Code fire on page load, before any banner can stop them. Remove them and declare them as services in your CMP, so the CMP loads them only after consent. If you keep GTM, place its container at the end of the <head>, after the CMP snippet.

Step 3: paste the CMP snippet at the start of the head

In Project Settings → Custom Code, click Add Script, name it clearly, paste the snippet and choose the start of the <head> as the placement. Keep it active on all pages. Framer reserves custom domains for paid site plans; if the editor asks you to upgrade when you add the script, your current plan does not include it.

Step 4: handle page changes without reload

A Framer site changes pages in the browser without a full reload. Make sure your banner follows these navigations, otherwise a script added on one page can escape the consent check. In FlowConsent this is the SPA Mode setting.

Step 5: block embeds until consent

Videos, maps and booking widgets set cookies as soon as they load. Configure your CMP to replace them with a placeholder until the visitor accepts the relevant category.

Step 6: connect Google Consent Mode v2

If you use Google Analytics or Google Ads, the banner must update the four Consent Mode v2 signals (ad_storage, analytics_storage, ad_user_data, ad_personalization). Our Google Consent Mode v2 implementation guide covers the details.

Step 7: remove the Framer Cookie Banner and publish

If you added Framer's Cookie Banner component earlier, delete it. Two banners mean two conflicting choices and consent you cannot prove. Then click Publish: custom code does not run in the canvas preview.

Open the published site in a private window. The banner should appear, with "Accept" and "Reject" buttons at the same level. In the Network tab of the developer tools, no request to Google, Meta, LinkedIn or any other third party should leave before you click. Reject, then browse several pages: still nothing. Accept, and the scripts should load. Finally, check that a link or floating button lets visitors change their mind at any time.

Common mistakes on Framer

  • Testing in the canvas. Custom code only runs on the published site.
  • Leaving GA4 in Custom Code while relying on the built-in component, which only controls GTM.
  • Running two banners after installing a CMP without deleting the Framer component.
  • Hiding the reject option in a second layer. The CNIL fined Google €150 million and Facebook €60 million in December 2021 because refusing cookies took more clicks than accepting them, and the EDPB cookie banner taskforce report of January 2023 takes the same line.
  • Adding the banner to some pages only. It must load everywhere so that scripts are blocked and visitors can withdraw consent on any page.

FlowConsent installs on Framer with one snippet pasted at the start of the <head> in Project Settings → Custom Code, and setup takes about ten minutes. It blocks scripts before consent, includes Google Consent Mode v2, follows Framer's page changes with SPA Mode and scans your site for cookies automatically. Every choice is stored and can be exported as proof of consent, and data is hosted in Europe. FlowConsent is free up to 25,000 sessions per month, then Pro costs €14.99 per month up to 100,000 sessions. The Framer installation guide walks through each step, including how to remove Framer's own banner.

Questions

Common questions on this topic.

Can't find your question? Write to us, we answer fast.

Does Framer have a built-in cookie banner?

Yes. Framer offers a free Cookie Banner component that you place in a shared component such as the navigation. It sends visitors' choices to Google Consent Mode through your Google Tag Manager container ID, with separate settings for the EU and the rest of the world. It only controls tags that run through GTM: scripts pasted in Custom Code and embeds such as YouTube load regardless of the visitor's answer.

Do I need a cookie banner if I only use Framer Analytics?

Usually not. According to Framer, its built-in analytics do not use cookies, so they do not require consent under the ePrivacy rules. Strictly necessary cookies, such as a session cookie for a password-protected page, are exempt too. As soon as you add Google Analytics, a marketing pixel, YouTube videos, a booking widget or a chat, you need a banner that asks for consent before those tools load.

Does the Framer Cookie Banner block Google Analytics automatically?

Only if Google Analytics runs as a tag inside Google Tag Manager, with consent checks configured. If you pasted the GA4 snippet in Project Settings → Custom Code, it fires on page load whatever the visitor chooses, because the component has no control over scripts outside GTM. Move GA4 into GTM, or use a consent management platform that blocks scripts by category before consent.

Why doesn't my cookie banner show in the Framer preview?

Framer does not run custom code in the canvas preview, so a banner loaded through Project Settings → Custom Code only appears on the published site. Click Publish, then open the live address in a private window, where no earlier choice is stored. If it still does not appear, check that the script is placed at the start of the head and active on all pages.

Where do I paste a cookie banner script in Framer?

Open Project Settings, select the Custom Code tab and click Add Script. Paste the snippet, give it a clear name, choose the start of the head as the placement and keep it active on all pages. Placing it first matters: the banner must load before any analytics or marketing script so it can block them until the visitor consents. Then publish the site.

Make your site compliant today.

Free up to 25,000 sessions a month. No credit card, no commitment.