0

I would like to add a cookie message to inform readers that my blog is using cookies. I am using hugo blogdown with the "tranquilpeak" theme. Unfortunately, this theme doesn't have the privacy pack implemented yet, so I tried to add the infos which are used in the "academic" theme from this site. I added:

privacy_pack = true

to "config.toml". Created the "cookie_consent.html" file with

{{ if .Site.Params.privacy_pack }}
<link rel="stylesheet" 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>
<script>
  window.addEventListener("load", function(){
    window.cookieconsent.initialise({
      "palette": {
    "popup": {
      "background": "#000"
    },
    "button": {
      "background": "#f1d600"
    }
  },
  "content": {
    "message": {{ i18n "cookie_message" | default "This website uses cookies to ensure you get the best experience on our website." }},
    "dismiss": {{ i18n "cookie_dismiss" | default "Got it!" }},
    "link": {{ i18n "cookie_learn" | default "Learn more" }}
       }
})});
    </script>
     {{ end }}

and than I added:

 {{ partial "cookie_consent.html" . }}

to the file "header.html". Unfortunately the cookie statement is not showing up and I don't know where to start searching for the reason. Any help is appreciated.

1
  • Hi ... just wondering ... have you checked in console / developer tools that the script src loaded and wasnt blocked by your browser
    – Damien
    Commented Jun 29, 2020 at 16:33

1 Answer 1

0

Thankfully, Maateen pointed out that one can use the Cookie Consent JavaScript plugin.

You can visit this link and generate your own codes. However, for a quick workaround, you can copy the following codes and paste them at the end of "foot_end.html" of your theme.

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css" />
<script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js" data-cfasync="false"></script>
<script>
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#2D2D39"
    },
    "button": {
      "background": "#14a7d0"
    }
  },
  "theme": "edgeless",
  "position": "bottom-right",
  "content": {
      "message": "This website uses cookies for Google Analytics so that I know how many people are reading the blog and which blogposts are the most popular. The website does not collect any personal data.",
  "href": "https://www.cookiesandyou.com/"
  }
});
</script>

To see a demo of this code, you may visit my blog

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.