Add partytown package and Google tag to astro.config.mjs and base-lay…

…out.astro
akash-network · Feb 24, 2024 · ea5f812 · ea5f812
1 parent 62334da
commit ea5f812
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 0 deletions.
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -5,6 +5,7 @@ import { defineConfig } from "astro/config";
 import remark from "remark-directive";
 import { customAsidePlugin } from "./src/lib/aside/customAsidePlugin";
 import astroExpressiveCode from "astro-expressive-code";
+import partytown from "@astrojs/partytown";
 
 import mdx from "@astrojs/mdx";
 
@@ -44,6 +45,11 @@ export default defineConfig({
       },
     }),
     mdx(),
+    partytown({
+      config: {
+        forward: ["dataLayer.push"],
+      },
+    }),
   ],
   site: "https://akash.network",
 });
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@astrojs/mdx": "^2.0.2",
+    "@astrojs/partytown": "^2.0.4",
     "@astrojs/react": "^3.0.8",
     "@astrojs/sitemap": "^3.0.3",
     "@astrojs/tailwind": "^5.0.4",

diff --git a/src/layouts/base-layout.astro b/src/layouts/base-layout.astro
@@ -28,6 +28,20 @@ const isProd = import.meta.env.PROD;
   class="scroll-pt-[137px] scroll-smooth"
 >
   <head>
+    <!-- Google tag (gtag.js) -->
+    <script
+      type="text/partytown"
+      async
+      src="https://www.googletagmanager.com/gtag/js?id=G-GL5HS9J1PR"></script>
+    <script type="text/partytown">
+      window.dataLayer = window.dataLayer || [];
+      function gtag() {
+        dataLayer.push(arguments);
+      }
+      gtag("js", new Date());
+
+      gtag("config", "G-GL5HS9J1PR");
+    </script>
     <BaseHead title={title} description={description} image={image} />
     <ViewTransitions />
   </head>
@@ -36,6 +50,7 @@ const isProd = import.meta.env.PROD;
     <AsideTailwindClasses />
     <!-- Dev tools -->
     {!isProd && <TailwindIndicator />}
+
     <script>
       //light-plus data-theme dark-plus in html tag
       const getTheme = () => localStorage.getItem("theme") || "light";