Try it on this page
The banner on this site is not a screenshot. Every page here loads consentio-loader.min.js as a
blocking script in <head> — route 1,
the same markup the documentation gives you.
It also runs with consentRequired: true, which is the hardest setting to get right: a full-screen
blocking overlay that a visitor has to answer before they can reach the page. If you have already answered,
clear the cookie below and it comes back.
🍪 Your answer, and how to change it
Reading…
🔍 What to look at
- The bar and the settings modal are rendered inside a closed shadow root, so nothing on this page can style them and nothing on this page leaks into them.
- Tab through it with the mouse untouched. With
consentRequired: truethe overlay is a dialog: Tab stays inside it, and Escape from the settings goes back to the bar. - The cookie is named
consentiohere, because this site does not rename it. The readout above is its value, decoded — the cookie explains what is in it. window.ConsentioDefaultin the console holds what the very first message to Google was built from, before anything had been downloaded.- Open the settings panel above is an ordinary page button calling
window.ConsentioInstance.openSettings()— the same link a site adds to its footer. It works whether or not you have answered, and pressing it twice leaves one panel with focus where you put it.
🏷️ The other route, on the same site
Try it through a tag manager is the one page here that does not have the script tag. It is where the two ways of installing are checked against each other: answer the banner on this page, then open that one and see whether it agrees about you.
📡 Watching what it sends
Open the console and read window.dataLayer before and after you answer. The first entry is the
consent default — what you were allowed before answering. Answering adds a consent update with all seven
permissions named again. What it tells Google
sets out both.
document.addEventListener('consentio:consent-update', (e) => console.log(e.detail));