Add Google Tag Manager and cookie consent (#943)

* Add Google Tag Manager and cookie consent * Disable google analytics on cookie decline
DjangoGirls · Feb 6, 2024 · 80eab99 · 80eab99
1 parent f92baf2
commit 80eab99
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 0 deletions.
diff --git a/templates/event/base.html b/templates/event/base.html
@@ -3,6 +3,14 @@
 <!DOCTYPE HTML>
 <html>
 <head>
+  <!-- Google tag (gtag.js) -->
+  <script async src="https://www.googletagmanager.com/gtag/js?id=G-JGJW1VEY0D"></script>
+  <script>
+    window.dataLayer = window.dataLayer || [];
+    function gtag(){dataLayer.push(arguments);}
+    gtag('js', new Date());
+    gtag('config', 'G-JGJW1VEY0D');
+  </script>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
   <title>{% block title %}{% trans "Django Girls - start your journey with programming" %}{% endblock %}</title>
   <meta name="description" content="{% block description %}{% trans "Django Girls is a one-day workshop about programming in Python and Django tailored for women." %}{% endblock %}">
@@ -60,5 +68,6 @@
 {% include 'event/global_sponsors.html' %}
 
 {% include 'includes/js.html' %}
+{% include 'global/cookie_modal.html' %}
 </body>
 </html>
diff --git a/templates/global/base.html b/templates/global/base.html
@@ -3,6 +3,14 @@
 <!DOCTYPE HTML>
 <html>
 <head>
+    <!-- Google tag (gtag.js) -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=G-JGJW1VEY0D"></script>
+    <script>
+        window.dataLayer = window.dataLayer || [];
+        function gtag(){dataLayer.push(arguments);}
+        gtag('js', new Date());
+        gtag('config', 'G-JGJW1VEY0D');
+    </script>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
   <title>{% block title %}{% trans "Django Girls - start your journey with programming" %}{% endblock %}</title>
   <meta name="description" content="{% block description %}{% trans "Django Girls is a one-day workshop about programming in Python and Django for women." %}{% endblock %}">
@@ -37,5 +45,6 @@
     {% endblock %}
 
     {% include 'includes/js.html' %}
+    {% include 'global/cookie_modal.html' %}
 </body>
 </html>
diff --git a/templates/global/cookie_modal.html b/templates/global/cookie_modal.html
@@ -0,0 +1,58 @@
+<div id="cookieModal" class="modal fade" role="dialog">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">We value your privacy</h5>
+            </div>
+            <div class="modal-body">
+                <p>We use cookies on this website to enhance your user experience. By clicking "I agree", you are giving your consent for us to set cookies.</p>
+                <p>For more information on what data is contained in the cookies, please see our <a href="/privacy-cookies/">Privacy Policy</a> page.</p>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal" id="rejectCookies">I decline</button>
+                <button type="button" class="btn btn-primary" data-dismiss="modal" id="acceptCookies">I agree</button>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script>
+    $(document).ready(function(){
+      // Cookie consent functions
+      function setCookie(name, value, days) {
+          var expires = "";
+          if (days) {
+              var date = new Date();
+              date.setTime(date.getTime() + (days*24*60*60*1000));
+              expires = "; expires=" + date.toUTCString();
+          }
+          document.cookie = name + "=" + (value || "") + expires + "; path=/";
+      }
+
+      function getCookie(name) {
+          var nameEQ = name + "=";
+          var ca = document.cookie.split(';');
+          for(var i=0;i < ca.length;i++) {
+              var c = ca[i];
+              while (c.charAt(0)==' ') c = c.substring(1,c.length);
+              if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
+          }
+          return null;
+      }
+
+      // Show cookie consent modal if not accepted yet
+      if(getCookie('cookiesAccepted') === null){
+          $('#cookieModal').modal('show');
+      }
+
+      // Handle cookie consent choices
+      $('#acceptCookies').on('click', function(){
+          setCookie('cookiesAccepted', 'true', 365);
+      });
+
+      $('#rejectCookies').on('click', function(){
+          setCookie('cookiesAccepted', 'false', 365);
+          window['ga-disable-G-JGJW1VEY0D'] = true;
+      });
+    });
+  </script>