gatsby-plugin-google-gtag-cookieconsent

This is an altered fork of gatsby-plugin-google-gtag.

The README at the time of the forking.

You can find more detailed information in this blogpost Cookie Consent with Gatsby and Google Tagmanager.

Purpose

Easy configurable plugin to have a cookie consent popup with opt-in before loading any gtag script as required by some gdpr laws.

It stitches together the gatsby-plugin-google-gtag plugin with this awesome cookieconsent library.

The final result will look like this:

Usage

Install the plugin via

1npm install --save gatsby-plugin-google-gtag-cookieconsent

Add this to your gatsby-config.js

1    {
2      resolve: `gatsby-plugin-google-gtag-cookieconsent`,
3      options: {
4        cookieConsentConfig: { ... },
5        enableForAllEnvironments: true,
6        googleGtagPluginConfig: { ... },
7      },
8    },

You might want to set enableForAllEnvironments to false to only enable the plugin for production builds.

In order to save space in your config file, I would recommend to move the extensive cookie consent config into a separate file, e.g. cookie-consent-config.js:

1exports.cookieConsentConfig = {
2  categories: {
3    necessary: {
4      enabled: true, // this category is enabled by default
5      readOnly: true, // this category cannot be disabled
6    },
7    analytics: {},
8  },
9  language: {
10    default: "en",
11    translations: {
12      en: {
13        consentModal: {
14          ...
15        },
16        preferencesModal: {
17          ...
18        },
19      },
20    },
21  },
22};

And then import it in your gatsby-config.js

1const { cookieConsentConfig } = require("./cookie-consent-config");

For detailed information of the available config please reference cookieconsent or gatsby-plugin-google-gtag directly.

Quick example configs can be found in the examples folder.