diff --git a/lib/gtm.ts b/lib/gtm.ts
new file mode 100644
index 0000000..43a1808
--- /dev/null
+++ b/lib/gtm.ts
@@ -0,0 +1,17 @@
+import { debugLogger } from "./debugLogger";
+
+declare global {
+ interface Window {
+ dataLayer: Record[];
+ }
+}
+
+export const GTM_ID = "GTM-NDPCVWBM";
+
+export const pageview = (url: string): void => {
+ debugLogger(`Logging pageview for ${window.location.pathname}`);
+ window.dataLayer.push({
+ event: "pageview",
+ page: url,
+ });
+};
diff --git a/package.json b/package.json
index d331c6d..87a6521 100644
--- a/package.json
+++ b/package.json
@@ -25,7 +25,6 @@
"nextra-theme-docs": "3.0.0-alpha.8",
"react": "^18.2.0",
"react-dom": "^18.2.0",
- "react-ga4": "^2.1.0",
"react-social-login-buttons": "3.9.1"
},
"devDependencies": {
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 69cbb85..4c1f261 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -3,45 +3,37 @@ import type { AppProps } from "next/app";
import type { ReactElement } from "react";
import { useEffect } from "react";
import { useRouter } from "next/router";
-import ReactGA from "react-ga4";
-import { debugLogger } from "@/lib/debugLogger";
-
-export const logPageView = () => {
- debugLogger(`Logging pageview for ${window.location.pathname}`);
- ReactGA.set({ page: window.location.pathname });
- ReactGA.send({ hitType: "pageview", page: window.location.pathname });
-};
-
-export const initGA = () => {
- debugLogger("init GA");
- ReactGA.initialize("G-EPBVRTSKFD");
-};
+import Script from "next/script";
+import { GTM_ID, pageview } from "@/lib/gtm";
export default function App({ Component, pageProps }: AppProps): ReactElement {
const router = useRouter();
- useEffect(() => {
- if (window.location.hostname === "localhost") {
- debugLogger("Running on localhost. Skip initGA.");
- return;
- }
- initGA();
- // `routeChangeComplete` won't run for the first page load unless the query string is
- // hydrated later on, so here we log a page view if this is the first render and
- // there's no query string
- if (!router.asPath.includes("?")) {
- logPageView();
- }
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, []);
-
useEffect(() => {
// Listen for page changes after a navigation or when the query changes
- router.events.on("routeChangeComplete", logPageView);
+ router.events.on("routeChangeComplete", pageview);
return () => {
- router.events.off("routeChangeComplete", logPageView);
+ router.events.off("routeChangeComplete", pageview);
};
}, [router.events]);
- return ;
+ return (
+ <>
+ {/* Google Tag Manager - Global base code */}
+
+
+ >
+ );
}
diff --git a/pages/_document.tsx b/pages/_document.tsx
index d88c076..bec4e85 100644
--- a/pages/_document.tsx
+++ b/pages/_document.tsx
@@ -1,50 +1,19 @@
+import { GTM_ID } from "@/lib/gtm";
import Document, { Html, Head, Main, NextScript } from "next/document";
-// interface LangSettingDocumentProps extends DocumentInitialProps {
-// lang: string;
-// }
-
-// class LangSettingDocument extends Document {
-// static async getInitialProps(ctx: any) {
-// const supportedLocales = {
-// en: "en-US",
-// es: "es-ES",
-// pt: "pt-BR",
-// ru: "ru-RU",
-// de: "de-DE",
-// fr: "fr-FR",
-// ja: "ja-JP",
-// ko: "ko-KR",
-// };
-// const initialProps = await Document.getInitialProps(ctx);
-// const { pathname } = ctx;
-// const localEntry = Object.entries(supportedLocales).find((entry) =>
-// pathname.startsWith(`/${entry[0]}`)
-// );
-// const lang = localEntry ? localEntry[1] : "en-US";
-// return { ...initialProps, lang };
-// }
-
-// render() {
-// return (
-//
-//
-//
-//
-//
-//
-//
-// );
-// }
-// }
-
-// export default LangSettingDocument;
-
const LangSettingDocument = ({ lang }: any) => {
return (
+
diff --git a/yarn.lock b/yarn.lock
index 690dbab..cbc7218 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4863,11 +4863,6 @@ react-dom@18.2.0, react-dom@^18.2.0:
loose-envify "^1.1.0"
scheduler "^0.23.0"
-react-ga4@^2.1.0:
- version "2.1.0"
- resolved "https://registry.yarnpkg.com/react-ga4/-/react-ga4-2.1.0.tgz#56601f59d95c08466ebd6edfbf8dede55c4678f9"
- integrity sha512-ZKS7PGNFqqMd3PJ6+C2Jtz/o1iU9ggiy8Y8nUeksgVuvNISbmrQtJiZNvC/TjDsqD0QlU5Wkgs7i+w9+OjHhhQ==
-
react-is@^16.13.1, react-is@^16.7.0:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"