Consent Control Demo

User friendly consent control

Consent Control gives the user full control before loading various assets, analytic tools or external services like Embedded Videos, Maps,...

See Github Repo

Demo

Reopen Consent Control

Place a button with .consent-control--open on privacy page

Consent iframes & videos directly

Just use data-src instead

Init Map

Could be Google Maps too

This map is loaded from Open Street Map.
By Loading the Map your IP-address will be transmited to external servers. See privacy page for more informations.

New in 2.0

Block your own scripts

Mark any tag type="text/plain" data-consent="analytics" — it stays inert until the category is granted, then runs automatically.

Inline script: ⏸ blocked until “Analytics” is granted

Live consent state

Kept in sync via the consent-updated window event.

Granted: —

This demo also uses the categories/children vocabulary, an opt-in “reject all” button (rejectButton: true), a config-driven analytics service (declarative scripts + inlineScript instead of a callback), and consent versioning. Reopen the banner and toggle Analytics to see it all react.

Notes

If you don't use bootstrap

Include consentcontrol.bootstrap.css to make use of the nice switches, or style them as you like