Begin integration of google analytics LBC-324

app/templates/app/completed_gift_purchase.html

@@ -1,4 +1,14 @@
 {% extends "base.html" %}
+{% block extra_js %}<script>
+    window.addEventListener('load', 
+    function() { 
+        gtag('event', 'purchase', {
+            transaction_id: "",
+            value: "{{promo_code.coupon.percent_off}}% | {{subscription.promo_code.coupon.amount_off}}",
+            coupon: "{{promo_code.code}}",
+          });
+    }, false)
+</script>{% endblock %}
 {% load account setting django_bootstrap5 %}
 {% block head_title %}Welcome to the Left Book Club{% endblock %}
 {% block content %}

app/templates/app/completed_gift_redemption.html

@@ -1,4 +1,17 @@
 {% extends "base.html" %}
+
+{% block extra_js %}<script>
+
+    window.addEventListener('load', function() {
+
+        gtag('event', 'completed_gift_redemption', {
+            transaction_id: "",
+            user: "{{ user.username }}",
+            value: "{{user.active_subscription.membership_plan_price}}",
+            gift_user: "{{user.gift_giver}}"
+        });
+    }, false)
+</script>{% endblock %}
 {% load wagtailsettings_tags account setting django_bootstrap5 wagtailcore_tags static wagtailroutablepage_tags django_bootstrap5 setting %}
 {% block head_title %}Welcome to the Left Book Club{% endblock %}
 {% block content %}

app/templates/app/completed_membership_purchase.html

@@ -1,4 +1,13 @@
 {% extends "base.html" %}
+{% block extra_js %}<script>
+    window.addEventListener('load', 
+    function() { 
+        gtag('event', 'purchase', {
+            transaction_id: "",
+            value: "{{user.active_subscription.membership_plan_price}}",
+          });
+    }, false)
+</script>{% endblock %}
 {% load wagtailsettings_tags account setting django_bootstrap5 wagtailcore_tags static wagtailroutablepage_tags django_bootstrap5 setting %}
 {% block head_title %}Welcome to the Left Book Club{% endblock %}
 {% block content %}
@@ -8,6 +17,7 @@
     <header class="pricing-header p-3 pb-md-4 mx-auto text-center">
         <h1 class="h2 fw-normal">Welcome to the Left Book Club, {% user_display user %}</h1>
         <p>You've successfully started a membership plan</p>
+
     </header>
     <div class="d-flex flex-column justify-content-center align-items-center mb-4">
         {% include "app/includes/membership_card.html" %}
@@ -18,4 +28,4 @@ <h1 class="h2 fw-normal">Welcome to the Left Book Club, {% user_display user %}<
             {% include "app/includes/layout.html" with streamfield=settings.app.MembershipJourney.welcome_content %}
         {% endif %}
     </div>
-{% endblock %}
+{% endblock %}

app/templates/app/donate_success.html

@@ -1,4 +1,14 @@
 {% extends "base.html" %}
+{% block extra_js %}<script>
+    window.addEventListener('load', 
+    function() { 
+        gtag('event', 'donation', {
+            transaction_id: "",
+            user: "{{ user.username }}"
+            value: "{{ user.active_subscription.price_string }}",
+          });
+    }, false)
+</script>{% endblock %}
 {% load wagtailsettings_tags account setting date django_bootstrap5 wagtailcore_tags static wagtailroutablepage_tags django_bootstrap5 setting %}
 {% block head_title %}Donation successful | Left Book Club{% endblock %}
 {% block content %}

app/templates/app/includes/cart_options.html

@@ -20,7 +20,15 @@
                           aria-hidden="true"></span>
                     <span>Loading...</span>
                 {% else %}
-                    <button class="btn btn-outline-secondary btn-disable-strikethrough"
+                    <button  onclick="gtag('event','add_to_cart', {
+                        value: {{variant.price}},
+                        currency: 'GBP',
+                        items: [
+                        {
+                          item_id: {{variant.id}},
+                    }]
+                });" 
+                    class="btn btn-outline-secondary btn-disable-strikethrough"
                             {% if variant.inventory_quantity == 0 and variant.inventory_policy == 'deny' %} disabled="true" {% elif loading or disabled %} disabled="true" {% else %} data-bs-toggle="offcanvas" data-bs-target="#cart" data-action="click->product#add" data-product-variant-id-param="{{ variant.id }}" {% endif %}>
                         Add to cart
                     </button>

app/templates/app/upgrade_success.html

@@ -1,4 +1,14 @@
 {% extends "base.html" %}
+{% block extra_js %}<script>
+    window.addEventListener('load', 
+    function() { 
+        gtag('event', 'membership_upgrade', {
+            transaction_id: "",
+            user: "{{user.username}}"
+            value: "{{user.active_subscription.membership_plan_price}}",
+          });
+    }, false)
+</script>{% endblock %}
 {% load wagtailsettings_tags account setting date django_bootstrap5 wagtailcore_tags static wagtailroutablepage_tags django_bootstrap5 setting %}
 {% block head_title %}Update successful | Left Book Club{% endblock %}
 {% block content %}

app/templates/base.html

@@ -6,7 +6,6 @@
         {% user_data %}
         {% include "sentry/globals.html" %}
         {% include "posthog/globals.html" %}
-        {% include "googleanalytics/initialise.html" %}
         <meta charset="utf-8" />
         <meta name="description" content="" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -48,16 +47,15 @@
             </noscript>
             <!-- End Meta Pixel Code -->
         {% endif %}
-        {% setting "GOOGLE_TAG_MANAGER" as GOOGLE_TAG_MANAGER %}
-        {% if GOOGLE_TAG_MANAGER %}
-        <!-- Google Tag Manager -->
-<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
-    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
-    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
-    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
-    })(window,document,'script','dataLayer','GTM-{{ GOOGLE_TAG_MANAGER }}');</script>
-    {% endif %}
-    <!-- End Google Tag Manager -->
+     <!-- Global site tag (gtag.js) - Google Analytics -->
+     <script async src="https://www.googletagmanager.com/gtag/js?id={% setting 'GOOGLE_TRACKING_ID' %}"></script>
+     <script>
+     window.dataLayer = window.dataLayer || [];
+     function gtag(){dataLayer.push(arguments);}
+     gtag('js', new Date());
+
+     gtag('config', '{% setting "GOOGLE_TRACKING_ID" %}', { 'debug_mode': true });
+     </script>
     </head>
     <body class="{% block body_class %}{% endblock %} {% if self %} app-{{ self.content_type.app_label }} model-{{ self.content_type.model }}{% endif %} tw-min-h-screen d-flex flex-column"
           data-controller="product"