Cookie Control V8

Steps to creating a cookie banner with Cookie Control V8 should start with obtaining an API key from the client or setting one up with their email address.

The script

The example script below includes the options enabled for opening the banner on first load and accepted cookies set for analytics and tracking scripts.

var delete_cookie = function (name) {
    document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;path=/;domain={INSERT SITE DOMAIN};';
};

var config = {
    position: 'LEFT',
    theme: 'DARK',
    apiKey: '{INSERT API KEY}',
    product: 'COMMUNITY',
    initialState: "OPEN",
    logConsent : true,  
    text: {
        title: 'This site uses cookies.',
        intro: 'We use cookies to help make this website better. <a aria-label="learn more about cookies" role="button" tabindex="0" class="cc-link" href="{{ site.baseurl }}/cookie-policy" target="_blank" rel="noopener noreferrer">Learn more.</a>'
    },
    necessaryCookies: ['__stripe_mid', '__stripe_sid', 'checkout-test-session'],
    optionalCookies: [{
            name: 'analytics',
            label: 'Analytical Cookies',
            description: 'Analytical cookies help us to improve our website by collecting and reporting information on its usage.',
            cookies: ['__cfduid', '_ga', '_gid', '_gat'],
            onAccept: function () {

                // Add Google Analytics
                (function (i, s, o, g, r, a, m) {
                    i['GoogleAnalyticsObject'] = r;
                    i[r] = i[r] || function () {
                        (i[r].q = i[r].q || []).push(arguments)
                    }, i[r].l = 1 * new Date();
                    a = s.createElement(o),
                        m = s.getElementsByTagName(o)[0];
                    a.async = 1;
                    a.src = g;
                    m.parentNode.insertBefore(a, m)
                })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');

                ga('create', '{INSERT GOOGLE ANALYTICS ID}', 'auto');
                ga('send', 'pageview');
                // End Google Analytics

                // Add Facebook Pixel
                ! function (f, b, e, v, n, t, s) {
                    if (f.fbq) return;
                    n = f.fbq = function () {
                        n.callMethod ?
                            n.callMethod.apply(n, arguments) : n.queue.push(arguments)
                    };
                    if (!f._fbq) f._fbq = n;
                    n.push = n;
                    n.loaded = !0;
                    n.version = '2.0';
                    n.queue = [];
                    t = b.createElement(e);
                    t.async = !0;
                    t.src = v;
                    s = b.getElementsByTagName(e)[0];
                    s.parentNode.insertBefore(t, s)
                }(window,
                    document, 'script', 'https://connect.facebook.net/en_US/fbevents.js');

                fbq('init', '132281620533857');
                fbq('track', "PageView");

            },
            onRevoke: function () {
                // Disable Google Analytics
                window['ga-disable-{INSERT GOOGLE ANALYTICS ID}'] = true;
                // End Google Analytics
            },
            recommendedState : 'on',
            lawfulBasis : 'consent',
        },
        {
            name: 'marketing',
            label: 'Marketing Cookies',
            description: 'Marketing cookies track conversions from Facebook ads, optimize ads based on collected data, build targeted audiences for future ads, and re-market to qualified leads—people who have already taken some kind of action on our website.',
            cookies: ['fr'],
            onAccept: function () {

                // Add Facebook Pixel
                ! function (f, b, e, v, n, t, s) {
                    if (f.fbq) return;
                    n = f.fbq = function () {
                        n.callMethod ?
                            n.callMethod.apply(n, arguments) : n.queue.push(arguments)
                    };
                    if (!f._fbq) f._fbq = n;
                    n.push = n;
                    n.loaded = !0;
                    n.version = '2.0';
                    n.queue = [];
                    t = b.createElement(e);
                    t.async = !0;
                    t.src = v;
                    s = b.getElementsByTagName(e)[0];
                    s.parentNode.insertBefore(t, s)
                }(window,
                    document, 'script', 'https://connect.facebook.net/en_US/fbevents.js');

                fbq('init', '{INSERT FACEBOOK PIXEL ID}');
                fbq('track', "PageView");

            },
            onRevoke: function () {
                delete_cookie('fr');
            },
            recommendedState : 'on',
            lawfulBasis : 'consent',
        }
    ]
};

CookieControl.load(config);