# Privacy Tools

## Require consent

By default, Lucky Orange creates a visitor profile and session immediately after it has been loaded. If your website requires opting-in to tracking features, or you'd rather just control the session lifecycle yourself, you can take advantage of the consent API.

Part of the `LO.privacy` API, you can control consent by calling `setConsentStatus()` whenever your visitor has provided consent. If the status is set to `true` and was previously `false`, a new session recording will automatically begin.

```javascript
function onOptIn () {
    LO.privacy.setConsentStatus(true)
}
```

You can check if consent is current given using the following method:

```javascript
LO.privacy.getConsentStatus()
```

Finally, you'll need to toggle "Require Consent" in your site's [privacy settings](https://app.luckyorange.com/settings/app/privacy):

![](https://3621578573-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MWB8uqlKzvK_SjDKODj%2F-MlC0r-SeK51c2z103MA%2F-MlC19sNldGXQxhf7hwo%2Fimage.png?alt=media\&token=501181c5-8e04-48de-840a-711b4f56c79f)

## Hide sensitive content

The following content is always prevented from being sent as part of a session recording:

* Credit card numbers
* Social security numbers
* Keystrokes (`input` and `textarea`)

Any additional content can be hidden through the use of special CSS classes. Placing one of these classes on an element will scramble any text and blank out any images within that element.

* `lo-sensitive`
* `losensitive`

You can also mark specific elements as not sensitive. **This, however, will not override the above list of content that is always prevented.**

* `lo-not-sensitive`
* `lonotsensitive`

{% hint style="info" %}
Using the above classes will affect all nested children of the given element unless a child includes a class that negates the inherited class. Ex `lo-not-sensitive` within `lo-sensitive`.
{% endhint %}

## Opt-out of tracking

You can programmatically opt a visitor out of tracking with the following method on the privacy API.

```javascript
LO.privacy.optOut()
```

The above will set a first-party cookie in the visitor's browser that will prevent them from being tracked again unless they clear their cookies. This will only affect your website, the visitor will continue to be tracked on other websites that use Lucky Orange.

### Global opt out (Do Not Track)

Lucky Orange honors the browser "Do Not Track" setting in browsers that offer it. Visitors with this setting enabled will never be tracked by Lucky Orange.

## Allow visitors to control their data

In order to be transparent as possible as to what data Lucky Orange has collected for a specific visitor, a self-serve data management tool is available. This tool makes it very easy for visitors to see what data has been collected during their visits, allows deletion of that data, and explains how to opt out of tracking completely across all websites using Lucky Orange.

![](https://3621578573-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MWB8uqlKzvK_SjDKODj%2F-Mj4uRfjOD4JdEKX2zYe%2F-Mj4woL4P4IWOfwRyh_2%2Fimage.png?alt=media\&token=ff003454-f6ec-404e-bb35-42f5e4ae444b)

Using this tool requires passing a visitor's unique ID as a URL parameter:

```
https://privacy.luckyorange.com/visitor/{VISITOR-ID}
```

The on-page privacy API provides a convenient method to generate the necessary link:

```javascript
LO.privacy.getInfoLink()
```

For example, you could tie a button press to open a link to the privacy page:

{% tabs %}
{% tab title="Vanilla JS" %}

```markup
<button id="privacy-button">Manage my data</button>

<script>
    document
        .querySelector('#privacy-button')
        .addEventListener('click', () => {
            window.open(LO.privacy.getInfoLink())
        })
</script>
```

{% endtab %}

{% tab title="Vue" %}

```markup
<template>
    <a :href="getLink()" target="_blank">Manage my data</a>
</template>

<script>
export default {
    methods: {
        getLink () {
            return LO.privacy.getInfoLink()
        }
    }
}
</script>
```

{% endtab %}
{% endtabs %}
