Integrations

Cookie consent for Hugo and Jekyll

A static site needs no server for this: the banner is one tag in the template that renders <head>, with the key in your site config. Decisions are recorded by Croombit, not by your site.

Set it up with your AI agent

Connect the Croombit MCP server to your editor or coding agent and paste this. It creates the site, the cookie categories and the banner, and edits your code.

Using Croombit: create a site for this project and keep the cookie categories it comes with. Write the banner text and publish the banner. Create a TEST publishable key for localhost:3000. This is a Hugo site (or Jekyll): add the cmp.js tag first in <head> of the template that renders it, with the key from site params (croombitKey in hugo.toml, or croombit_key in _config.yml), and change our analytics tags to type="text/plain" with data-tc-consent.

The agent works in TEST. Going live takes two steps in the console: verify your domain and swap in a LIVE key — see going live.

Or by hand

Hugo

Put the key in your config. hugo server runs in the development environment, so a config/development/hugo.toml can hold the TEST key.

# hugo.toml (config/development/hugo.toml can hold the pk_test_ key for `hugo server`)
[params]
  croombitKey = "pk_live_…"

Then the tag, first in <head>. If it comes from your theme, copy the file to the same path under your project's layouts/ to override it.

{{/* layouts/partials/head.html — or wherever your theme renders <head> */}}
<meta charset="utf-8">
<script src="https://croombit.com/cmp.js" data-tc-api-key="{{ site.Params.croombitKey }}"></script>
{{/* …everything else after it */}}

Jekyll

# _config.yml
croombit_key: pk_live_…

<!-- _includes/head.html (copy it from your theme to override it) -->
<meta charset="utf-8">
<script src="https://croombit.com/cmp.js" data-tc-api-key="{{ site.croombit_key }}"></script>

Hold back trackers

Change their type to text/plain and add data-tc-consent. Hugo's built-in Google Analytics template can't be tagged — remove it and paste the snippet below instead.

<script type="text/plain" data-tc-consent="analytics" async
        src="https://www.googletagmanager.com/gtag/js?id=G-XXXX"></script>
<script type="text/plain" data-tc-consent="analytics">
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXX');
</script>
<div data-tc-cookie-declaration></div>
<a href="#" data-tc-open-preferences>Cookie settings</a>

Questions

Does it work on GitHub Pages, Netlify or Cloudflare Pages?

Yes. It is plain HTML; any static host serves it.

How do I keep the cookie list current?

Run a scan from the console, or schedule one. The data-tc-cookie-declaration table fills itself from the latest scan, with no rebuild.