Cookies — properly used in bootScore

With­out per­mis­sion, we may not write cook­ies to the hard disk of our read­er. Because it belongs to her, not to us. By access­ing our site, she has already implic­it­ly giv­en her con­sent to store our tech­ni­cal­ly nec­es­sary cook­ies. Because they are tech­ni­cal­ly nec­es­sary to read our post. But she must explic­it­ly per­mit us to save the oth­er cook­ies on her com­put­er before we are going to do so. More­over, we must have enabled her to query what these cook­ies are for before we offer her to answer our request. That’s the mean­ing if we talk about prop­er­ly used cook­ies.

For this, bootScore offers us a con­fig­urable cook­ie approval dia­logue eval­u­at­ed by the bsCook­ie-plu­g­in:

Solution

• Down­load bsCook­ie.
• Install the zip file via the plu­g­in man­age­ment of your Word­Press back­end.
• Deter­mine the cook­ies you want to install on your read­er’s com­put­er.¹
• Assign each of these cook­ies to one of the groups ‘nec­es­sary’², ‘adver­tis­ing’ or ‘ana­lyt­ics’.
• In the dia­log ‘Appearance/Widgets’ drag a wid­get ‘Cus­tomer HTML’ into the wid­get group Footer‑4.
• Enter the script lines into that sub-wid­get as offered by bsCook­ie doc­u­men­ta­tion.
• For each of your plu­g­ins add an entry into the cor­re­spond­ing sec­tion.
• Link your pri­va­cy page into the dia­log by replac­ing #your­pri­va­cy­pol­i­cy accord­ing­ly.
• Trans­late the texts into the lan­guage of your site (or cre­ate an addi­tion­al entry accord­ing to your mul­ti­lin­gual strat­e­gy).

Background

Ask­ing for per­mis­sion to write cook­ies via a dia­logue is only one side of the coin. Cook­ies can also store (per­son­al) (iden­ti­fi­ca­tion) data. So, the respec­tive web serv­er can ask for that infor­ma­tion and hand it over to third par­ties. Hence, we must men­tion such cook­ies in our data pro­tec­tion con­cept addi­tion­al­ly. To enable our read­ers to call this page direct­ly from the cook­ie con­sent dia­logue, the bsCook­ie dia­logue text con­tains a link whose val­ue #your­pri­va­cy­po­lice we should aling accord­ing­ly.

It has become a good tra­di­tion to group cook­ies func­tion­al­ly and to ask once for the com­plete group whether we may file the respec­tive cook­ies. That’s legal­ly not nec­es­sary: We could also let the use of cook­ies agree or dis­agree quite gen­er­al­ly.³ Or we could make every sin­gle cook­ie selec­table or des­e­lec­table — which would over­load the dia­logue.

How­ev­er, at first, we need to know which cook­ies our site writes and what the cook­ies actu­al­ly do. Our browsers can sup­port us. For exam­ple, by means of its ‘Pri­va­cy and Secu­ri­ty’ dia­log. Or with the help of a brows­er plu­g­in⁴, which shows direct­ly for each called site/page, which cook­ies have been writ­ten by it. But what our cook­ies do, we have to deter­mine sep­a­rate­ly.

Once we have grouped our cook­ies func­tion­al­ly, we only need to cre­ate the appro­pri­ate groups as sec­tions in the bsCook­ie dia­log. Then we must insert for each cook­ie — asso­ci­at­ed with that group — an entry in the respec­tive sec­tion. For the three com­mon groups ‘nec­es­sary’, ‘adver­tis­ing’, and ‘ana­lyt­ics’ bsCook­ie already pro­vides the respec­tive code. If these groups fit our needs, it is suf­fi­cient for us to describe the cook­ies in and with the sin­gle entries. Assum­ing we want­ed to get per­mis­sion to write the three cook­ies nec­es­saryB­sCook­ie, adver­tis­ing­B­sCook­ie, and anal­iz­ing­B­sCook­ie, the JavaScript code of the bsCook­ie con­sent dia­logue should look like this:

<script>
  // Init
  window.addEventListener('load', function () {

    // obtain plugin
    var cc = initCookieConsent();

    // run plugin with your configuration
    cc.run({
      current_lang: 'en',
      autoclear_cookies: true,
      page_scripts: true,

      languages: {
        'en': {
          consent_modal: {
            title: 'Cookie Consent Request',
            description: 
'We use cookies to remember and reuse your preferences for future visits. By clicking “Accept all”, you permit us to use all cookies, technically necessary as well as functionally helpful. By clicking “necessary only”, you forbid us to use the functionally helpful, but technically not necessary cookies. For a more detailed consent, visit <a data-bs-toggle="modal" href="#bs-cookie-modal">Cookie Settings</a>.',
            primary_btn: {
              text: 'accept all',
              role: 'accept_all'
            },
            secondary_btn: {
              text: 'necessary only',
              role: 'accept_necessary'
            }
          },

          settings_modal: {
            title: 'Cookie settings',
            save_settings_btn: 'Save settings',
            accept_all_btn: 'accept all',
            reject_all_btn: 'necessary only',
            close_btn_label: 'close',
            cookie_table_headers: [
              { col1: 'Name' },
              { col2: 'Domain' },
              { col3: 'Expiration' },
              { col4: 'Description' }
            ],
            blocks: [
              {
                title: 'Cookie usage',
                description: 
'We use cookies to provide core website functions and to enhance your reading experience. For each category, you can choose to use them or not. For more details about cookies and other sensitive data, please read our <a href="https://karsten-reincke.de/datenschutz">Privacy Policy</a>.'
              }, {
                title: 'Necessary',
                description: 
'These cookies are essential for our website. Without them, the website would not work properly',
                toggle: {
                  value: 'necessary',
                  enabled: true,
                  readonly: true          // cookie categories with readonly=true are all treated as "necessary cookies"
                },
                cookie_table: [
                  {
                    col1: 'bs_cookie_settings',
                    col2: 'bootScore.me',
                    col3: 'deleted if your session becomes invalid',
                    col4: 
'cookie into which bootScore and the plugin bsCookies stores your cookie preferences',
                    is_regex: false
                  },
                  {
                    col1: 'nec­es­saryB­sCook­ie', 
                    col2: 'https://karsten-reincke.de',
                    col3: 'next 100 days',
                    col4: 'demo cookie of "pimp your BootScore"',
                    is_regex: false
                  },                 
                ]
              }, {
                title: 'Analytics',
                description: 
'These cookies allow the website to remember the choices you have made in the past',
                toggle: {
                  value: 'analytics',     // your cookie category
                  enabled: false,
                  readonly: false
                },
                cookie_table: [           // list of all expected cookies
                  {
                    col1: 'anal­iz­ing­B­sCook­ie',         
                    col2: 'https://karsten-reincke.de',
                    col3: 'next 10 Days',
                    col4: 'demo cookie of "pimp your BootScore"',
                    is_regex: false
                  }
                ]
              }, {
                title: 'Advertising',
                description: 
'These cookies collect information about how you use the website, which pages you visited and which links you clicked on. All data is anonymized and cannot be used to identify you',
                toggle: {
                  value: 'advertising',
                  enabled: false,
                  readonly: false
                },
                cookie_table: [             // list of all expected cookies
                  {
                    col1: 'adver­tis­ing­B­sCook­ie',
                    col2: 'https://karsten-reincke.de',
                    col3: '2 weeks',
                    col4: 'demo cookie of pimp your BootScore',
                    is_regex: false
                  }
                ]
              }, {
                title: 'More information',
                description: 
'For further questions concerning our data management, feel free to <a href="https://karsten-reincke.de/impressum">contact us</a>.',
              },

            ]
          }

        }
      }

    });
  });
</script>

Enter­ing the infor­ma­tion into the code of the cook­ie con­sent dia­logue is one thing. Acti­vat­ing the code is anoth­er. To do that, we put the cus­tomized bs-cook­ie-set­tings JavaScript code into a Cus­tom HTML ele­ment that we added to the Foot­er 4 wid­get. In prin­ci­ple, we could embed the Cus­tom HTML ele­ment in oth­er wid­gets as well. How­ev­er, bsCook­ie sug­gests Foot­er 4 because the JavaScript code should be embed­ded at the end of a page. Any­way, all pages using a tem­plate con­tain­ing the Foot­er 4 wid­get will then dis­play the cook­ie. That’s the method of how we solve the prob­lem of ‘deep links’.⁵

That left us with three final tasks:

• First, we will often want to lin­guis­ti­cal­ly cus­tomize our con­sent dia­logue as well. For that pur­pose, we can mod­i­fy the JavaScript code men­tioned above.
• Sec­ond­ly, the dia­log col­or is deter­mined by the def­i­n­i­tion of the func­tion­al col­or $warn­ing. Those who nev­er­the­less want to cus­tomize the dia­log may use her file <code>_bscore_custom.scss</code>:

  
  // design the bsCookie-Dialog
  #c-inr {
    border-color: darkblue;
    border-width: 2px;
    border-style: solid;
    background-color: #eef;
    color: blue($color: #000000);
    padding: 5px;
  }
  
  #c-p-bn {
    border-color: darkblue;
  }
  
  #c-s-bn {
    border-color: darkblue;
  }
   
  

• Third, we need to imple­ment the seman­tics of the cook­ie con­sent dia­log. If we want to walk the talk, we need to imple­ment our ‘stor­ing the cook­ie JavaScript code’ in a way that it writes only the tech­ni­cal­ly nec­es­sary cook­ies with­out con­sent, and that it oth­er­wise stores only the cook­ies from the groups for which there is con­sent.

I will take up this last point in a sep­a­rate post …

---

And how does this …

… sup­port our migra­tion to bootScore? Well, besides her nor­mal design work, the web-design­er must deal with some legal require­ments, as — for exam­ple — those of the DSGVO pri­va­cy, of hav­ing a cook­ie con­sent dia­log and the respec­tive seman­tic, of hav­ing a data pri­va­cy page, an imprint, an image ref­er­ence page, and a FOSS com­pli­ance page. This post shall sup­port you to man­age your legal issues.

---

1. We have to keep in mind that our plu­g­ins can also try to store cook­ies. So it’s not enough to just look for the cor­re­spond­ing JavaScript com­mands in our own posts and pages [↩]
2. Cook­ies that we assign to this group will last­ly be placed on our read­er’s hard dri­ve even with­out explic­it con­sent, pre­cise­ly because they are tech­ni­cal­ly nec­es­sary. So we must be able to prove if nec­es­sary that these cook­ies are indeed tech­ni­cal­ly nec­es­sary. [↩]
3. How­ev­er, greater gran­u­lar­i­ty is in our inter­est. Because if a read­er does­n’t want one thing — e.g. adver­tis­ing — she could still allow the oth­er — e.g. ana­lyt­ics. That way, we would still learn at least a part of what we hoped to learn over­all. [↩]
4. e.g. with the Cook­ie Edi­tor [↩]
5. We must keep in mind that our read­ers could direct­ly call links to deep­er embed­ded pages. Even in this case, we may only write cook­ies, if we are allowed to do so. [↩]