Add google tag manager (#308)

This commit is contained in:
Eduard Gert
2025-04-24 20:48:35 +02:00
committed by GitHub
parent e98d360f46
commit 89ccf4d56e
2 changed files with 35 additions and 1 deletions

View File

@@ -0,0 +1,31 @@
import * as React from "react";
import Script from "next/script";
// Google Tag Manager ID
const GTM_ID = "GTM-PGWDPDN3";
export const GoogleTagManagerHeadScript = () => {
return (
<Script id="gtm-script" strategy="afterInteractive">
{`(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_ID}');`}
</Script>
);
};
export const GoogleTageManagerBodyScript = () => {
return (
<noscript>
<iframe
title={"Google Tag Manager"}
src={`https://www.googletagmanager.com/ns.html?id=${GTM_ID}`}
height="0"
width="0"
style={{ display: "none", visibility: "hidden" }}
/>
</noscript>
);
};

View File

@@ -1,4 +1,5 @@
import { Head, Html, Main, NextScript } from 'next/document'
import {GoogleTageManagerBodyScript, GoogleTagManagerHeadScript} from "@/components/GoogleTagManager";
const modeScript = `
let darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)')
@@ -39,10 +40,12 @@ export default function Document() {
return (
<Html lang="en">
<Head>
<script dangerouslySetInnerHTML={{ __html: modeScript }} />
<GoogleTagManagerHeadScript />
<script dangerouslySetInnerHTML={{ __html: modeScript }} />
<link rel="shortcut icon" href="/docs-static/img/favicon.ico" />
</Head>
<body className="bg-white antialiased dark:bg-zinc-900">
<GoogleTageManagerBodyScript />
<Main />
<NextScript />
</body>