Skip to main content

docusaurus-plugin-cookie-consent

A GDPRGDPR EU data-protection regulation that requires explicit consent before setting non-essential cookies or tracking users.-friendly cookie consent modal/toast for Docusaurus sites with:

  • Configurable text (markdown links supported) and link list
  • Accept all / Reject optional / Reject all buttons
  • Cookie categories (necessary, analytics, marketing, functional)
  • useCookieConsent hook for gating scripts on consent
  • Google Consent Mode v2 integration for GTM/GA4/Ads
  • A cookieConsentChange DOM event for PostHog/Plausible/custom analytics

Why use it

You need to respect user consent before loading tracking scripts. This plugin gives you the UI + preference storage; your code is responsible for actually not loading scripts until hasCategoryConsent() returns true (see the hook).

Live demo

This site uses the plugin in toast mode — look for the consent banner in the corner.

Real-world example

The plugin ships a sample site plus four client-integration snippets at examples/:

  • sample-site/ — full Docusaurus example
  • client-conditional-loading.ts — gate script tags on consent
  • client-dom-manipulation.ts — show/hide elements based on consent
  • client-event-listeners.ts — hook into cookieConsentChange
  • client-external-library.ts — PostHog / Plausible style integration

Compatibility

  • Docusaurus ^3.0.0
  • React ^18.2.0

What this plugin is not

  • A substitute for a lawyer. It helps you comply, but your privacy/cookie policies and your site's tracking behavior are your responsibility.
  • An auto-blocker. It does not stop scripts that ignore hasCategoryConsent() — your code has to check.