Integration Optout

Based on the functionality of Trackboxx, fundamentally no opt-in is necessary.

Nevertheless, we would like to offer our customers the option of providing an opt-out function.

Briefly explained - what does opt-out mean in our case?

Through the opt-out function, you can display a "switch/button" using a small script.

Standardmäßig ist dieser deaktiviert. Wenn dieser jedoch vom Webseiten Besucher aktiviert wird, werden dessen Besuche nicht mehr getrackt.

The customer can therefore object to the tracking on the respective website.

The button looks as follows after integration:

Integration of the opt-out

Fundamentally, the respective script for the opt-out is already in the template for the Trackboxx privacy statement. You can find it HERE.

Nonetheless, an overview of the separate integration of the script shall be provided here again.

In the following, we describe to you two ways to integrate the opt-out into your website. Once completely manually and once via the Trackboxx plugin (currently available for WordPress).

Option 1 - Manual Integration

Use the following code and adjust your tracking ID in the first step.

Diese findest du indem du im Trackboxx Dashboard unter Einstellungen (Zahnrad) > Webseiten klickst. Hinter den angelegten Webseiten findest du den Button "Tracking Code".

Code:

<label class="tb-switch">
<input type="checkbox" data-domain="TB-XXXXXXXXXX" id="tbTrackingAllowed" value="true"/>
<span class="tb-slider tb-round"></span>
</label>
<span id="trackingStatus">Allow Tracking</span>
<script type="text/javascript">
function tbInitTrackingCheckBox(id) {
var checkBox = document.getElementById(id);
var statusText = document.getElementById('trackingStatus');
checkBox.checked = trackboxxHelper.trackingEnabled();
statusText.textContent = checkBox.checked ? 'Meine Besucherdaten fließen in die Web-Analyse ein.' : 'Meine Besucherdaten fließen nicht in die Web-Analyse ein.';
checkBox.onclick = function () {
this.checked ? trackboxxHelper.enableTracking() : trackboxxHelper.enableTracking('no');
statusText.textContent = this.checked ? 'Meine Besucherdaten fließen in die Web-Analyse ein.' : 'Meine Besucherdaten fließen nicht in die Web-Analyse ein.';
};
}
document.addEventListener("tbScriptLoaded", function () {
tbInitTrackingCheckBox('tbTrackingAllowed');
});
</script>

You can simply integrate this section into your privacy statement - ideally as an extension to the Trackboxx privacy statement.

Damit nun der "toogle Button" auch grafisch korrekt dargestellt wird, verwende bitte das folgende CSS:

.tb-switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}

/* Hide default HTML checkbox */
.tb-switch input {
opacity: 0;
width: 0;
height: 0;
}

/* The slider */
.tb-slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}

.tb-slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}

input:checked + .tb-slider {
background-color: #2196F3;
}

input:focus + .tb-slider {
box-shadow: 0 0 1px #2196F3;
}

input:checked + .tb-slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}

/* Rounded sliders */
.tb-slider.tb-round {
border-radius: 34px;
margin-right:5px;
}

.tb-slider.tb-round:before {
border-radius: 50%;
}

Option 2 - WordPress Plugin

If you are using the Trackboxx WordPress Plugin, you do not need to integrate the CSS yourself. In the settings of the Trackboxx Plugin, you will find the opt-out code, copy it and insert it accordingly into your privacy statement.

As mentioned, this guide should describe the integration of the opt-out again separately. In the section for your privacy statement, it is already integrated by default.