CMP Events
In order to get notifications when certain events occur, you can use the following JavaScript Methods:
__cmp("addEventListener",["eventname",callableFunction,capture],null)__cmp("removeEventListener",["eventname",callableFunction,capture],null)__tcfapi("addEventListener",2, callableFunction)__tcfapi("removeEventListener",2, callableFunction, listenerId)
The CMP can call the following events:
|
Event |
Description |
|
|
CMP code is loaded and the stub code has been removed. At this stage the CMP has no information about the consent yet. |
|
|
CMP finished loading its settings. If a consent string existed already, the consent data can now be read from the CMP. |
|
|
CMP shows the consent screen |
|
|
CMP removes the consent screen |
|
|
CMP shows the custom choices page |
|
|
CMP has gathered consent or a preexisting cookie was found. Consent data can now be read from the CMP. |
|
|
Visitor gave positive consent to all vendors/purposes |
|
|
Visitor rejected all vendors and purposes |
|
|
Visitor gave custom consent (accepts and rejections) |
|
|
Consent screen is shown, legitimate interest has been established for this visitor. |
|
|
Visitor accepted an dynamic content item. Vendor ID of the accepted item can be found in subtype variable. |
|
|
Various events for the IAB GPP standard |
tcfv2 |
Various events for the IAB TCF standard |
|
|
Once loading is finished (see event |
|
|
Once loading is finished (see event |
Event handler are defined as:
var handler = function (eventname, cmpobject, subtype){…} Warning: Do not use cmpobject anymore. The function is deprecated. Use API calls instead.
Example:
<script>
function getInfos(e,o)
{
var result = __cmp('getCMPData');
/*... do something with result ...*/
}
__cmp("addEventListener",["consent",getInfos,false],null);
</script>Please note that the IAB TCF v2 addEventListener command will react only on a subset of events.
Examples
Redirecting the visitor to a different website if no consent is given
Please note that this behavior is not recommended and might cause legal issues!
<script>
function getInfos(e,o)
{
location.href = "https://www.mywebsite.com/alternative-content.html";
}
__cmp("addEventListener",["consentrejected",getInfos,false],null);
</script>Showing a message if the visitor rejected
<div id="mymessage" style="display:none; position:fixed; left:calc(50% - 300px); top:calc(50% - 200px); width:600px; height:400px; background-color: #fff0c7; padding: 20px; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);"><b>Please consider</b><br>Our website is mainly financed by online advertising. Without consent we will not be able to show you tailored ads and our ad revenue will be much lower. As we respect your choice we like to ask you, if you maybe like to donate 1 EUR instead? This will help us keep the quality of our service up.<br>
<br>
<a href="donate.html"><b>Donate 1 EUR now!</b></a><br>
<br>
<a href="#" onclick="document.getElementById('mymessage').style.display = 'none';">No, thanks!</a>
</div>
<script>
function getInfos(e,o){ document.getElementById('mymessage').style.display = 'block';}
__cmp("addEventListener",["consentrejected",getInfos,false],null);
</script>Pushing the page content down when consent layer opens
<script>
var iscmpopen = false;
function handleSize()
{
if(iscmpopen)
{
document.body.style.paddingTop = document.getElementById('cmpbox').offsetHeight + 'px';
}
else
{
document.body.style.paddingTop = 'inherit';
}
}
function pushDown(e, o)
{
iscmpopen = true;
handleSize();
}
function pushUp(e, o)
{
iscmpopen = false;
handleSize();
}
window.addEventListener('resize', handleSize, false);
window.addEventListener('load', handleSize, false);
__cmp('addEventListener', ['consentscreen', pushDown, false], null);
__cmp('addEventListener', ['consentscreenoff', pushUp, false], null);
</script>