Add a GDPR cookie banner to your Bolt app
Bolt usually scaffolds a Vite + React app, and sometimes Next.js or another framework. Either way the consent script belongs in the shared document <head>, before any analytics — and the Bolt agent can put it there for you.
Updated 28 October 2026
Set it up in 5 steps
- 1Design your banner and copy your site keyCreate your banner in the PrivacyPill customizer and save it to the domain your Bolt app is published on to get a site key.
- 2Ask the Bolt agentPaste the prompt below into your Bolt chat, with your site key in the script URL. The agent picks the right file for your project's framework.
- 3Check the codeOpen the code editor and confirm the tag is the first script in index.html (Vite) or in the root layout via next/script (Next.js) — not inside a component or effect.
- 4Gate your trackersAsk the agent to change non-Google trackers to type="text/plain" with data-pp-category="analytics" or "marketing". Google tags follow Consent Mode automatically.
- 5Publish and testClick Publish in the top right (Bolt hosting by default, or Netlify if you connected it). Open the live URL in a private window and try reject and accept.
Add this exact tag as the first script in the shared document <head> on every page, before any analytics or advertising scripts:
<script src="https://privacy-pill-consent-studio.lovable.app/api/public/v1/pp.js?site=pp_your_site_key"></script>
Check which framework this project uses first. For a Vite app put it in index.html; for Next.js use next/script with strategy="beforeInteractive" in the root layout. Don't load it from useEffect or a page component, don't add async or defer, and don't add it twice. Then list any analytics, pixels or embeds in the app so I can gate them with data-pp-category.Replace pp_your_site_key with your site key — you'll get it when you save your banner.
Bolt hosting or Netlify — same setup
The banner is part of your app's code, so it ships with every publish whichever host you pick. Save every domain you serve the app on — your custom domain and any Bolt or netlify.app address you share — as a site, or the banner stays hidden there.
Using a Bolt database or user accounts? Those are strictly necessary for logins and don't need consent. Analytics and marketing tags do.
Agents can set it up end to end
PrivacyPill has a REST API and a remote MCP server, so a coding agent can create your site, configure the banner, fetch the embed snippet and run a compliance scan. See the developer docs for the MCP URL and API reference.
Frequently asked questions
Set up PrivacyPill on other platforms
See all- Shopify cookie bannertheme.liquid install + Customer Privacy API.
- Webflow cookie bannerPaste one line into Head code and publish.
- WordPress cookie bannerWPCode or functions.php, classic and block themes.
- Wix cookie bannerSettings → Custom Code → Head, all pages.
- Squarespace cookie bannerCode Injection → Header on Core plans and up.
- Framer cookie bannerProject Settings → Custom Code, start of head.
- Lovable cookie bannerOne prompt to the Lovable agent, or one tag.
- v0 cookie bannernext/script in the root layout, publish to Vercel.
- Next.js cookie bannernext/script beforeInteractive in the root layout.
- Ghost cookie bannerSettings → Code Injection → Site header.
- HubSpot cookie bannerSite header HTML + setHubSpotConsent sync.
Try it on your own site
Design your banner, preview it live, and paste one line. Free for one domain.