The Cookie Consent Plugin

Last updated: 27.02.2020

Let's get our hands dirty and look into the Cookie Consent plugin. The Cookie Consent plugin adds a little banner to each page of a website, so that the user can agree to the website's cookie policy.

You might think that you don't need a plugin for that. And you are right: You can simply visit the Cookie Consent website, configure your cookie consent banner, copy the code, and paste it into your theme. It'ss only a bit of JavaScript and CSS. The script from the cookie consent website looks like this:

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js"></script>
window.addEventListener("load", function(){
  "palette": {
    "popup": {
      "background": "#d48484",
      "text": "#ffffff"
    "button": {
      "background": "#362929",
      "text": "#fff"
  "content": {
    "message": "This website uses cookies to ensure you get the best experience on our website.",
    "dismiss": "OK",
    "link": "Learn more"

So what is the point of creating a plugin just to add this little script to a website?

The Problem With Hardcoding

Hard coding the cookie consent script manually into your TYPEMILL-theme has two downsides:

Wouldn't it be much better to configure the cookie consent in the setup area of TYPEMILL, and to add the cookie consent banner to a theme without even touching it?

Of course, so let's try it:

How The Plugin Should Work

Before we start, let's describe how the cookie consent plugin should work:

Next: Create a File Structure

In the next chapters, we will learn how to add a cookie banner easily with a TYPEMILL plugin. Let's start with a file structure.