feat: adding Google Analytics (#18)

RichardsonWTR · web-flow · commit 038951ac1d8d · 2025-11-02T10:37:20.000-03:00
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -2,6 +2,7 @@ import { defineConfig } from 'astro/config';
 import tailwind from '@astrojs/tailwind';
 import react from '@astrojs/react'; // Add this line
 import mdx from '@astrojs/mdx';
+import partytown from '@astrojs/partytown';
 
 // Determine site URL based on environment
 const getSiteURL = () => {
@@ -30,5 +31,10 @@ export default defineConfig({
     tailwind(),
     react(),
     mdx(),
+    partytown({
+      config: {
+        forward: ["dataLayer.push"],
+      },
+    }),
   ],
 });
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -14,6 +14,7 @@
     "@astrojs/db": "0.14.10",
     "@astrojs/mdx": "4.2.3",
     "@astrojs/node": "9.1.3",
+    "@astrojs/partytown": "2.1.4",
     "@astrojs/react": "4.2.3",
     "@astrojs/rss": "3.0.0",
     "@astrojs/sitemap": "^3.0.0",
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -27,6 +27,15 @@ const { title, description = "A minimalist personal blog" } = Astro.props;
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <!-- Google tag (gtag.js) -->
+    <script type="text/partytown" async src="https://www.googletagmanager.com/gtag/js?id=G-PFZ9KVEQPD"></script>
+    <script type="text/partytown">
+      window.dataLayer = window.dataLayer || [];
+      function gtag(){dataLayer.push(arguments);}
+      gtag('js', new Date());
+
+      gtag('config', 'G-PFZ9KVEQPD');
+    </script>
   </head>
   <body class="bg-white dark:bg-zinc-900 text-zinc-900 dark:text-zinc-100 min-h-screen flex flex-col">
     <!-- Page transition overlay - for smooth transitions between pages -->
