feat: add matomo tracking

seasick · Dec 31, 2023 · 9ff9190 · 9ff9190
1 parent 4b64e11
commit 9ff9190
Show file tree

Hide file tree

Showing 4 changed files with 84 additions and 0 deletions.
diff --git a/build.mjs b/build.mjs
@@ -1,5 +1,6 @@
 import * as esbuild from 'esbuild';
 import { copy } from 'esbuild-plugin-copy';
+import { replace } from 'esbuild-plugin-replace';
 
 const options = {
   entryPoints: ['src/index.tsx', 'src/index.html'],
@@ -31,6 +32,9 @@ const options = {
       },
       watch: true,
     }),
+    replace({
+      __MATOMO_TRACKING_HOST: process.env.MATOMO_TRACKING_HOST || 'localhost',
+    }),
   ],
 };
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -16,6 +16,7 @@
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
     "esbuild": "0.19.10",
     "esbuild-plugin-copy": "^2.1.1",
+    "esbuild-plugin-replace": "^1.4.0",
     "prettier": "^3.1.1",
     "typescript": "5.0.4"
   },

diff --git a/src/index.html b/src/index.html
@@ -12,5 +12,34 @@
   <body>
     <div id="root"></div>
     <script src="index.js"></script>
+
+    <!-- Matomo -->
+    <script>
+      var _paq = (window._paq = window._paq || []);
+      /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+      _paq.push(['trackPageView']);
+      _paq.push(['enableLinkTracking']);
+      (function () {
+        var u = '//__MATOMO_TRACKING_HOST/';
+        _paq.push(['setTrackerUrl', u + 'matomo.php']);
+        _paq.push(['setSiteId', '2']);
+        var d = document,
+          g = d.createElement('script'),
+          s = d.getElementsByTagName('script')[0];
+        g.async = true;
+        g.src = u + 'matomo.js';
+        s.parentNode.insertBefore(g, s);
+      })();
+    </script>
+    <!-- End Matomo Code -->
+
+    <noscript>
+      <img
+        referrerpolicy="no-referrer-when-downgrade"
+        src="https://__MATOMO_TRACKING_HOST/matomo.php?idsite=2&amp;rec=1"
+        style="border: 0"
+        alt=""
+      />
+    </noscript>
   </body>
 </html>