Unc Inc - Cookie consent

Cookie consent package for non headless frontend websites

How to implement in a non headless project in jquery:

Implement the following block in your main JS file, replacing YOUR_THEME with the proper folder:

``
$(once('cookie-banner', 'html')).each(function(e) {
const body = document.getElementsByTagName('body')[0];
const div = document.createElement('div');
div.id = 'uncinc-cookie-compliance';
body.appendChild(div);

$.getJSON('/themes/YOUR_THEME/cookie/cookie-consent.json', function(data){
window.cookieBannerSettings = data;
const head = document.getElementsByTagName('head')[0];
const script= document.createElement('script');
script.type= 'text/javascript';
script.src= '/themes/YOUR_THEME/cookie/uncinc-cookie.min.js';
head.appendChild(script);
});
});
`

Add a cookie consent json with the properties you want to set to the component, and include a build js from this project in the project as well in the proper folder.

See for example this JSON example:

`

{
"loadDelay": 1000,
"title": "Test",
"manualText": "Zelf instellen",
"acceptAllText": "Alles accepteren",
"acceptSelectionText": "Selectie Accepteren",
"onlyNecessaryText": "Alleen benodigde",
"cookieContentsShowMore": "Toon meer",
"cookieContentsShowLess": "Toon minder",
"manualHeader": true,
"cookieLevels": [
{
"value": "necessary",
"label": "Nodig",
"description": "Beschrijving",
"disabled": true,
"consentOptions": ["security_storage"]
},
{
"value": "preferences",
"label": "Voorkeuren",
"description": "Beschrijving",
"disabled": false,
"consentOptions": ["functionality_storage", "personalization_storage"]
},
{
"value": "statistics",
"label": "Statistieken",
"description": "Beschrijving",
"disabled": false,
"consentOptions": ["analytics_storage"]
},
{
"value": "marketing",
"label": "Test",
"description": "Beschrijving",
"disabled": false,
"consentOptions": ["ad_personalization", "ad_user_data", "ad_storage"]
}
],
"defaultValues": {
"necessary": true,
"preferences": false,
"statistics": false,
"marketing": false
},
"bodyContents": "

Welkom bij 'naam klant'

Accepteer je deze cookies? zie onze cookie link

"
}

``

The component can be styled from the outside.