# Usercentrics

URL: https://docs.ablyft.com/developers/integrations/usercentrics/

> A/B test Usercentrics consent banner variants and track banner events as goals.



You can test variants of your Usercentrics banner with ABlyft. The variants are designed in Usercentrics. ABlyft
decides which variant a visitor gets and measures the result.

> Place the ABlyft script in the `<head>` before the Usercentrics script.

## Experiment and variations

1. Create an experiment with a variation of the type **Code**.
2. In the variation, set a global variable: `window.UC_AB_VARIANT = "variant1";`
3. In the original, set the same variable to `"variant0"`.

## Goals

Usercentrics reports these events:

| Event                   | Meaning                         |
| ----------------------- | ------------------------------- |
| `CMP_SHOWN`             | The banner appeared             |
| `ACCEPT_ALL`            | Accept all was clicked          |
| `DENY_ALL`              | Deny all was clicked            |
| `SAVE`                  | Save was clicked                |
| `MORE_INFORMATION_LINK` | More information was clicked    |
| `IMPRINT_LINK`          | Imprint link was clicked        |
| `PRIVACY_POLICY_LINK`   | Privacy policy link was clicked |

Create one **Custom** goal for each event you want to measure. The API name is `usercentrics_` plus the event name, for
example `usercentrics_ACCEPT_ALL`.

## Forward the events

Add this to **Project JavaScript** in the project settings:

```js
window.addEventListener('UC_UI_CMP_EVENT', function (data) {
  window['ablyft'] = window['ablyft'] || [];
  window['ablyft'].push({
    eventType: 'custom',
    eventName: 'usercentrics_' + data.detail.type,
  });
});
```

More about custom goals: [Custom goals](https://docs.ablyft.com/developers/tracking-and-events/custom-goals/).

