QR CMP: Basic Implementation

To configure the CMP in its CTV/HbbTV version, you need to edit the file where it will be implemented (e.g., index.html) using a code editor.

The CMP is loaded from a file. And then it is initialized. In the code below, replace the URL {{URL}} with the URL we will provide, which contains the CMP configuration. This URL will be hosted on the Sibbo server.

Include the code on all pages that load the CMP within the <head> tag of the page, as follows:

<html>
<head>
...
<script src="https://cmp.sibbo.net/v2.2/sibboqr/sibbo-cmp-qr-front.js" charset="utf-8"></script>
<script>
//<![CDATA[
SibboCMP.init("{{URL}}", true, false);
//]]>
</script>
...
</head>
</html>

The charset="utf-8" attribute is important because, without it, text may appear with incorrect characters.

In the method SibboCMP.init("{{URL}}", true, false); the true value indicates that JSONP is used for requests, while false indicates that fetch will be used. The second boolean, false, indicates that the HTTPS protocol will be used, and if it is true, the HTTP protocol will be used.

In the case of using the HTTP protocol, a second configuration file {{URL2}} will be necessary, which we will provide.

Example of integration with the HTTP protocol:

<html>
<head>
...
<script src="http://tvhttp.sibbo.net/v2.2/sibboqr/sibbo-cmp-qr-front.js" charset="utf-8"></script>
<script>
//<![CDATA[
SibboCMP.init("{{URL}}", true, true, "{{URL2}}");
//]]>
</script>
...
</head>
</html>

The load must be included as early as possible in the code.

Adding a link or button with the text "Cookies" or "Cookie Settings" to the page hosting the CMP is mandatory. This link or button should trigger the method SibboCMP.openBanner(true), which will reopen the CMP.

Example:

<a href="#" rel="nofollow" onclick="SibboCMP.openBanner(true)">Cookies</a>

For integrating the CMP with programmatic advertising, refer to QR CMP: Methods and QR CMP: Events.