Ocyan plugin Cookie Jar

Learn more

Learn more about cookies in the Netherlands at: https://www.rijksoverheid.nl/onderwerpen/privacy-en-persoonsgegevens/vraag-en-antwoord/mag-een-website-ongevraagd-cookies-plaatsen

Installation

1. Add ocyan.plugin.cookie_jar to your projects dependencies.
2. Add CONFIG to your config/ocyan.json

Development

if you create a new snippet, make sure the id inside of the config is the same name as the folder.

Usage

You can use the cookie_jar plugin for custom external scripts in your project. The cookie_jar plugin adds a variable named cookie_jar to all templates by means of a template context processor.

If you are using any snippets. scripts or content that might add cookies, then you must:

1. Determine what type of cookies are set (functional, analytical, social or marketing)
2. Wrap the snippet in an if statement like this:

For functional cookies:

{% if cookie_jar.functional.is_approved %}
<script>
    // api integration
</script>
{% endif %}

For analytical cookies:

{% if cookie_jar.analytical.is_approved %}
<script>
    // some kind of analytics script
</script>
{% endif %}

For social cookies:

{% if cookie_jar.social.is_approved %}
<script>
    // facebook ellende and tracking cookies
</script>
{% endif %}

For marketing cookies

{% if cookie_jar.marketing.is_approved %}
<script>
    // advertisements
</script>
{% endif %}

Doing this will be enough to make sure that IF ANY APPROVAL IS NEEDED the content will only be rendered if the approval was given by the user. If no approval is needed at all, the content will always be rendered

This means you should also use this to wrap functional and analytical cookie content, because if the rules change, we will simply update the logic to the new rules and we can update all sites in 1 go.

Profiling script impact

When a site has a very bad mobile score it can be useful to turn off all external scripts that are being loaded to determine the cause. Add the "profile-script-impact" parameter to the url to turn off all cookiejar categories which will disable loading any external scripts.

http://127.0.0.1:8000/categorie/tassen/kleine-tassen-10/?profile-script-impact

Script delay

By changing the value of the settings COOKIE_JAR_SCRIPT_DELAY in your project's django setting you can change the delay befor some of cookiejar's scripts become activated. By default 8000 miliseconds is used as the delay to stop google page speed from complaining

Accepted settings

"settings": [
{
  "name": "cookie_jar",
  "description": "Cookie Jar",
  "dependencies": [
    "wagtail_oscar"
  ],
  "ocyan_plugins": [
    "ocyan.plugin.cookie_jar"
  ],
  "settings": [
    {
      "id": "bing_uet",
      "title": "Bing Universal Event Tracking id",
      "type": "text",
      "required": false,
      "help": "Bijvoorbeeld: 32000206"
    },
    {
      "id": "google_analytics",
      "title": "Google tracking id",
      "type": "text",
      "required": false,
      "help": "Bijvoorbeeld: UA-XXXXXXXX-X"
    },
    {
      "id": "script_location",
      "title": "Where should the google analytics/tagmanager script go?",
      "type": "dropdown",
      "multiple": false,
      "fields": [
        "footer",
        "header"
      ],
      "default": "footer",
      "required": false,
      "help": "For performance reasons this script should go in the footer, but if the customer insists, it can be put in the head as well"
    },
    {
      "id": "google_tag_manager",
      "title": "Google tag manager tracking id",
      "type": "text",
      "required": false,
      "help": "Bijvoorbeeld: GTM-XXXXXX"
    },
    {
      "id": "google_tag_manager_cookie_type",
      "title": "Het cookie type van google tag manager",
      "type": "dropdown",
      "multiple": false,
      "fields": [
        "analytical",
        "social",
        "marketing"
      ],
      "default": "analytical",
      "required": false,
      "help": "Indien tag manager wordt gebruikt om externe script in te laden, kan het zijn dat er cookies van een ander type dan analytical worden gezet. Kies dan het juiste type"
    },
    {
      "id": "trusted",
      "title": "Trusted Shops ID",
      "type": "text",
      "required": false,
      "help": "Bijvoorbeeld: X14CE9340F524XX5EBF7DF86A325611E1"
    },
    {
      "id": "tawk",
      "title": "Tawk Rechtstreekse gesprekskoppeling url",
      "type": "text",
      "required": false,
      "help": "Bijvoorbeeld: https://embed.tawk.to/609a7b53b1d5182476b7d907/1f5dn3gb8 De koppelurl valt te vinden onder: Administratie (tandwieltje) -> Klik onder channels het kopje 'Chat-widget' > Rechtstreekse gesprekskoppeling. Let wel op! deze url begint met tawk.to, dat moet embed.tawk.to zijn."
    },
    {
      "id": "facebook_pixel",
      "title": "Facebook pixel tracking id",
      "type": "text",
      "required": false,
      "help": "Bijvoorbeeld: XXXXXXXXXXXXXXXXX"
    },
    {
      "id": "facebook_pixel_cookie_type",
      "title": "Het cookie type van de Facebook pixel",
      "type": "dropdown",
      "multiple": false,
      "fields": [
        "marketing",
        "analytical",
        "social"
      ],
      "default": "marketing",
      "required": false,
      "help": "Indien de facebook pixel alleen wordt gebruikt voor analytics, kan je dat hiermee instellen"
    },
    {
      "id": "functional",
      "title": "functional cookies",
      "type": "boolean",
      "default": true,
      "help": "Cookies die er voor zorgen dat deze website naar behoren functioneert. Waaronder het toegang krijgen tot beschermde onderdelen van de website. Er zijn ook cookies voor geanonimiseerde analyse opgenomen."
    },
    {
      "id": "analytical",
      "title": "analytical cookies",
      "type": "boolean",
      "default": true,
      "help": "Cookies die informatie verzamelen zodat wij het gebruik van de website kunnen meten. Dit stelt ons in staat de structuur, navigatie en inhoud van de website zo gebruiksvriendelijk mogelijk voor je te maken."
    },
    {
      "id": "social",
      "title": "social cookies",
      "type": "boolean",
      "default": false,
      "help": "Cookies om de inhoud van onze website te delen via Social Media. Social Media netwerken doen aan profiling en tracking van bezoekers. Door deze cookies te accepteren kan je internetgedrag gemonitord worden door social media."
    },
    {
      "id": "marketing",
      "title": "marketing cookies",
      "type": "boolean",
      "default": false,
      "help": "Cookies waarmee advertenties kunnen worden afgestemd op jouw internetgedrag. Door deze cookies te accepteren kan je internetgedrag gemonitord worden door advertentie-netwerken."
    }
  ]

READ FIRST BEFORE CONTINUING:

In past installations we have seen that the script_location doesn't always matter for the following steps. And since we are to lazy to figgure out why, just try both event types.

A quick note on the script_location setting;

1. If you're setting this to "header" and you're using Google Tag Manager for Ecommerce tracking, make sure your Trigger "Event Type" is set to "Page View".
2. If you're setting this to "footer" and you're using Google Tag Manager for Ecommerce tracking, make sure your Trigger "Event Type" is set to "Page View - DOM Ready", otherwise it won't work.

More about this can be found here: https://www.analyticsmania.com/post/ecommerce-tracking-with-google-tag-manager/