Website elementsControls & details
Cookie consent
A cookie banner, built into your site with no plugin and no library. A consent bar and the Google Tag Manager loader it gates. Opt-out mode (the default) loads analytics until the visitor declines; opt-in loads nothing from Google until they accept; visitors whose browser time zone is in the EEA, UK or Switzerland get opt-in whichever mode is set. Decline stops GA and deletes the cookies it already wrote. Synced from ecropolis-consent, never edited here.
Opt-out mode, the default
Analytics load on the first visit. The bar says so, and Decline stops them and deletes what they wrote.
Opt-in mode
Nothing is requested from Google until the visitor presses Accept. Visitors in EEA, UK and Swiss time zones always get this.
Both frames run the real widget with strictRegions off, so each shows its own mode wherever you are. On a site leave it on. Nothing here reaches Google: gtm.js is blocked inside the frames, and the analytics cookies shown are stand-ins for the ones GA would set.
A consent bar that is yours: no monthly CMP fee, nothing loads from Google until the visitor has said yes where the law needs a yes.
Also called
CookieYesCookiebotComplianzGDPR Cookie Consentcookie bannerconsent barconsent mode
What it replaces
- CookieYes / Cookiebot / Complianz subscriptions
- Osano
- Termly
- A hand-written cookie banner that loads Google Analytics before the visitor clicks anything: it asks, but the tracking has already happened
Good for
A site that runs Google Analytics, or anything else, through Google Tag Manager and wants the consent choice on its own page, in its own colors, with no subscription. In opt-out mode US visitors are measured until they decline; with strictRegions on (the default), visitors in EEA, UK and Swiss time zones get prior consent, so nothing is fetched from Google until they accept. That region test reads the browser’s time zone: no IP lookup, no network call, and a VPN or a traveler can be misread either way.
Not for
A site that sets no cookies and loads no third-party tags. It needs no banner at all: leave gtmId empty and this renders nothing. Its job is gating Tag Manager, not decoration. Also not for sites that need per-category toggles, a stored consent log to show an auditor, or IAB TCF signals for ad networks: it is one yes-or-no for analytics, with ad storage denied unless enableAds is set. It does not make a site compliant by itself. It implements prior consent where that is required; the privacy policy, and what the site promises in it, are the site owner’s.
Accessibility
Written so the page works for every visitor, whether they browse with a mouse, a keyboard or a screen reader, and whether or not they have asked for less motion.
- Decline and Accept are native buttons, so Enter and Space work, and each is at least 44px tall. Below 560px they share the full width.
- The bar is a non-modal dialog named “Cookie consent”. It does not take focus or trap it, and the page stays usable while it is open. Sites mount it at the end of the body, so keyboard users reach it after the page content.
- It stays hidden (the hidden attribute) until the script has chosen the wording for the visitor’s mode, and is hidden again after a choice, so a screen reader never reads a bar that is not on screen.
- Any element with data-cc-reopen (the “Cookie settings” link in a site’s footer) opens it again, so the choice can be changed at any time. There is no Escape shortcut: the choice is made with the buttons.
- No movement: only 0.15s color transitions on hover. Default text and button colors clear 4.5:1; a site that themes it must keep them there.
Where it's live
- ecropolis.com: Every page
- growgrid.io: Every page
- superherotech.ai: Every page, with “Cookie settings” in the footer; and the demo on /elements/cookie-consent/
- compass.st: Every page
- zingfling.com: Every page
- vendorstreet.app: Every page
- apothecary.st: Every page
How to ask for it
“The cookie-consent on our home page, with …”
Name it, say which page and which part of the page it goes on, and say what goes in it: your photos, your words, your colors. That is a complete request. We build it, you approve it, and it goes live. If you know it by another name, from WordPress or from another site, that works too.
More elements you can ask for: Before / After, Particle field, Mega menu, Video background, Parallax band, Scroll reveal, Business hours, News ticker, Flip box, Instagram feed, Accordion / FAQ, Card slider, Tabs, Info list, Video player, Testimonial carousel, Icon library, Animated text, Animated background, Modal box, Announcement bar, Image hotspots, Info circle, Slide box, Countdown, Content toggle, Off-canvas panel, Video gallery, Map and directions, Link effects, Tabcordion, Tooltip, Responsive table, Notice, Toast, Loading, Menu button, Radio group, Stepper, Tags, Scrollbox, Sticker. Or see all of them working.
More in Controls & details
See them all working- Link effects
Links that answer back when you point at them, and never leave a keyboard user or a slow eye behind.
- Menu button
Tuck a handful of actions — share, export, edit, delete — behind one tidy button that works the same with a mouse, a keyboard or a screen reader.
- Radio group
Let people pick one option at a glance — as a list, as big cards with an icon, or as a pill switch — and it still posts like the plain form it is.
- Tags
Show the topics, features or filters that belong to something, and let visitors clear a filter with one tap.
Want the cookie consent on your site?
Tell us about the business. We build the site with it, launch it, and change it whenever you ask.