Community Plugin
View plugin on GitHub

gatsby-plugin-cookiebot

npm GitHub Made by Nitro

Easily add Cookiebot on a Gatsby site. Especially useful when using Cookiebot’s manual mode and gatsby-plugin-google-tagmanager.

Main features

  • Adds Cookiebot script to the page <head>
  • Blocks Google Tag Manager’s <script> and <noscript> tags created by gatsby-plugin-google-tagmanager when using Cookiebot’s manual mode by setting data-cookieconsent="statistics" and type="text/plain" to the tags

How to use

Install package

npm i gatsby-plugin-cookiebot

Configure gatsby-config.js

plugins: [
  {
    resolve: "gatsby-plugin-cookiebot",
    options: {
      cookiebotId: "00000000-0000-0000-0000-000000000000", // Required. Site's Cookiebot ID.
      manualMode: true, // Optional. Turns on Cookiebot's manual mode. Defaults to false.
      blockGtm: false, //  Optional. Skip blocking of GTM. Defaults to true if manualMode is set to true.
      includeInDevelopment: true, // Optional. Enables plugin in development. Will cause gatsby-plugin-google-tagmanager to thrown an error when pushing to dataLayer. Defaults to false.
      pluginDebug: true, // Optional. Debug mode for plugin development. Defaults to false.
    },
  },
];

Make sure gatsby-plugin-google-tagmanager is listed before gatsby-plugin-cookiebot

Contributing to gatsby-plugin-cookiebot

# You will need yalc in the destination project so better to install yalc globally
npm i -g yalc
# Watch for changes and publish locally with yalc
npm run develop
cd ../destination-gatsby-project
# Link local package to a project
yalc link gatsby-plugin-cookiebot
# Alternative way of attaching the published package with yalc
# yalc add gatsby-plugin-cookiebot
# Run gatsby clean and restart development server on plugin changes
gatsby clean && gatsby develop
## When changes are ready. Build and publish to NPM
npm run npm:publish

Roadmap

  • React wrapper for graceful failing
© 2022 Gatsby, Inc.