> ## Documentation Index
> Fetch the complete documentation index at: https://www.pagent.ai/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Usercentrics

> Pass your visitors' Usercentrics consent to pagent.

pagent loads early and reacts to your visitors' consent: it reports pseudonymous data before consent and stores its persistent cookies only after an **opt-in**. Two cookies are set without it: `_pgnt-seed`, which keeps test groups stable for a day, and `_pgnt-opt-in`, which stores the visitor's choice. List them in your cookie declaration. Your cookie banner tells pagent about the visitor's choice through two commands. See the [consent guide](https://www.pagent.ai/docs/guides/integration/consent.md) for how pagent handles consent, including the strict option that holds back all data until opt-in.

## 1. Add pagent as a service

In the Usercentrics admin, add pagent as a custom service named **pagent** in the category you use for analytics. The script below looks the service up by that name.

## 2. Keep Usercentrics from blocking pagent

With auto-blocking, mark the pagent snippet with `data-uc-allowed="true"`, so it loads before the page shows:

```html theme={"dark"}
<script
  data-uc-allowed="true"
  src="https://cdn.pagent.ai/js/sdk.js"
  data-client-key="YOUR_CLIENT_KEY">
</script>
```

## 3. Pass the consent to pagent

Add the script for your Usercentrics version after the pagent snippet.

**Web CMP (v3)**

This reads the visitor's stored choice when the page loads, and listens for the `UC_CONSENT` event whenever the choice changes:

```html theme={"dark"}
<script data-uc-allowed="true">
  (function () {
    window._pgnt = window._pgnt || [];

    function sendConsent(details) {
      var services = (details && details.services) || {};
      var pagent = Object.values(services).find(function (service) {
        return service.name === "pagent";
      });

      if (pagent) {
        window._pgnt.push({ kind: pagent.consent && pagent.consent.given ? "opt-in" : "opt-out" });
      }
    }

    window.addEventListener("UC_CONSENT", function (event) {
      sendConsent(event.detail);
    });

    function readStoredChoice() {
      if (window.__ucCmp) window.__ucCmp.getConsentDetails().then(sendConsent);
    }

    if (document.readyState === "complete") readStoredChoice();
    else window.addEventListener("load", readStoredChoice);
  })();
</script>
```

**Browser UI (v2)**

First, in the admin under **Implementation → Data Layer & Events**, add a **Window Event** named `ucEvent`. Then add:

```html theme={"dark"}
<script data-uc-allowed="true">
  (function () {
    window._pgnt = window._pgnt || [];

    function sendConsent(given) {
      window._pgnt.push({ kind: given ? "opt-in" : "opt-out" });
    }

    // The stored choice, on every page load.
    function readStoredChoice() {
      var pagent = window.UC_UI.getServicesBaseInfo().find(function (service) {
        return service.name === "pagent";
      });

      if (pagent) sendConsent(pagent.consent.status);
    }

    if (window.UC_UI && window.UC_UI.isInitialized()) readStoredChoice();
    else window.addEventListener("UC_UI_INITIALIZED", readStoredChoice);

    // Every change the visitor makes.
    window.addEventListener("ucEvent", function (event) {
      if (event.detail && event.detail.event === "consent_status" && "pagent" in event.detail) {
        sendConsent(event.detail.pagent === true);
      }
    });
  })();
</script>
```

## Check it worked

1. Open your site in a private window and accept the pagent service.
2. In your browser's developer tools, check that pagent's cookies starting with `_pgnt` appear.
3. Reopen the privacy settings, deny pagent, and check that they're removed again, except `_pgnt-seed` and `_pgnt-opt-in`, which now reads `false`.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.