# Cookie banner

> Turn on a simple Accept or Decline banner for your site with no code. Nothing is stored until a visitor accepts. You decide whether you need it.

Source: https://datacenter.so/docs/cookie-banner
Section: Start here

Datacenter can show a simple cookie banner on your site. Visitors pick **Accept** or **Decline**. Until they accept, Datacenter stores nothing on their device and works like Private mode.

You decide whether your site needs a banner and what it says. This page explains how the banner works. It is not legal advice. See [Tracking modes](https://datacenter.so/docs/tracking-modes) for what each mode stores.

## Turn it on

1. Open the site, then **Settings**.
2. Under **Cookie banner**, pick **Simple banner**.
3. Change the message and the button words if you like, add your privacy page, and pick your button color.
4. Press **Save banner**.

The banner shows on your site within 5 minutes. You do not change your tag: the 90-day tag loads the banner on its own while it is on.

**See it on a test page** opens a page that shows the banner with your settings, so you can try it before your visitors do.

The banner works in [90-day tracking](https://datacenter.so/docs/tracking-modes), on paid plans. Private mode stores nothing on the device, so it has nothing to ask.

## What it does

- Turning it on also turns on **Wait for consent**. Before a visitor answers, Datacenter stores nothing and sends nothing to Meta from the browser. Visits still count, the Private mode way.
- **Accept** is the same as `datacenter('consent', true)`: Datacenter may now keep its id and click ids for 90 days.
- **Decline** is the same as `datacenter('consent', false)`: anything stored is deleted.
- The answer is kept for 180 days in a first-party cookie, `_dc_b`, which holds only `1` or `0`. The banner does not show again until then.
- Form capture and tap counting wait for **Accept** too.

## Google Consent Mode

If your site runs Google tags (Google Ads, Google Analytics or Tag Manager), the banner passes each answer to Google as a Consent Mode v2 update: `ad_storage`, `ad_user_data`, `ad_personalization` and `analytics_storage`, all granted on **Accept** and all denied on **Decline**. On later pages it passes the saved answer again. Sites without Google tags get nothing extra.

Google also needs a starting state before its tag loads. Paste this above your Google tag. It starts from the visitor's saved answer, or denied until they pick:

```html
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
var v = /(^|; )_dc_b=1/.test(document.cookie) ? 'granted' : 'denied';
gtag('consent', 'default', { ad_storage: v, ad_user_data: v, ad_personalization: v, analytics_storage: v, wait_for_update: 500 });
</script>
```

The same snippet is under **Cookie banner** in the site's Settings, ready to copy.

## Let visitors change their answer

Add a link to `#datacenter-consent` anywhere on your site, such as in the footer:

```html
<a href="#datacenter-consent">Cookie settings</a>
```

A click on it opens the banner again.

## How it looks

- It sits at the bottom of the screen, over the page. Nothing on the page moves when it shows.
- **Match your site's theme** (the default) follows your site: a dark or light class or `data-theme` on the page, else how dark the page background is, else the visitor's device. It switches when your site does. You can pick **Always light** or **Always dark** instead.
- The Accept button uses your color, with black or white text, whichever reads better.
- Both buttons are the same size and at least 44 pixels tall. On narrow phones they sit under the message and fill its width.

## Accessibility

- The banner is a labeled region named "Cookie choice", placed first in the page, so keyboard and screen reader users meet it first. It does not trap focus.
- Both buttons work with the keyboard and show a clear focus ring.
- With reduced motion turned on, it appears without sliding in.

## Your own banner instead

When a site with 90-day tracking is added, Datacenter reads its home page. If it finds OneTrust, Cookiebot, Osano, Termly, iubenda, CookieYes, Usercentrics, Complianz, Didomi or Google consent mode with a denied default, it turns **Wait for consent** on for you and says so under **Done for you** in setup, with one tap to turn it off. Once you set it yourself, Datacenter leaves it alone. Until your tool runs the line below, visits still count, the Private mode way. **Set it up with AI** in setup adds the line for your tool.

If you already use a consent tool, keep the banner off. Turn on **Wait for consent**, and have your tool run this when a visitor agrees:

```js
datacenter('consent', true);
```

See [Tracking modes](https://datacenter.so/docs/tracking-modes#wait-for-consent).
