diff --git a/.changeset/four-suns-float.md b/.changeset/four-suns-float.md
deleted file mode 100644
index a1f2b1a4..00000000
--- a/.changeset/four-suns-float.md
+++ /dev/null
@@ -1,10 +0,0 @@
----
-'docs': minor
-'web': minor
-'@wayofdev/common-i18n': minor
-'@wayofdev/eslint-config-custom': minor
-'@wayofdev/jest-config': minor
-'@wayofdev/ui': minor
----
-
-feat: updating versions
diff --git a/.changeset/twelve-moons-sparkle.md b/.changeset/twelve-moons-sparkle.md
new file mode 100644
index 00000000..3dbdd239
--- /dev/null
+++ b/.changeset/twelve-moons-sparkle.md
@@ -0,0 +1,6 @@
+---
+'@wayofdev/google-tag-manager': patch
+'web': patch
+---
+
+feat: google-tag-manager support in web application
diff --git a/apps/web/src/pages/_document.tsx b/apps/web/src/pages/_document.tsx
index f3ecc992..4876cd9b 100644
--- a/apps/web/src/pages/_document.tsx
+++ b/apps/web/src/pages/_document.tsx
@@ -1,4 +1,5 @@
 import { Analytics } from '@vercel/analytics/react'
+import { GoogleTagManagerNoScript } from '@wayofdev/google-tag-manager/src'
 import type { DocumentContext, DocumentInitialProps } from 'next/document'
 import Document, { Html, Head, Main, NextScript } from 'next/document'
 import { i18n } from '../../next-i18next.config'
@@ -45,6 +46,7 @@ class MyDocument extends Document {
           <NextScript />
         </body>
         <Analytics />
+        <GoogleTagManagerNoScript />
       </Html>
     )
   }
diff --git a/packages/google-tag-manager/src/components/GoogleTagManagerNoScript.tsx b/packages/google-tag-manager/src/components/GoogleTagManagerNoScript.tsx
new file mode 100644
index 00000000..77d5b217
--- /dev/null
+++ b/packages/google-tag-manager/src/components/GoogleTagManagerNoScript.tsx
@@ -0,0 +1,16 @@
+import { gtmId } from '../lib/gtm'
+export function GoogleTagManagerNoScript() {
+  return (
+    <>
+      <noscript>
+        {/* eslint-disable-next-line jsx-a11y/iframe-has-title */}
+        <iframe
+          src={`https://www.googletagmanager.com/ns.html?id=${gtmId}`}
+          height="0"
+          width="0"
+          style={{ display: 'none', visibility: 'hidden' }}
+        />
+      </noscript>
+    </>
+  )
+}
diff --git a/packages/google-tag-manager/src/components/GoogleTagManagerScript.tsx b/packages/google-tag-manager/src/components/GoogleTagManagerScript.tsx
index 684a0b07..87f27205 100644
--- a/packages/google-tag-manager/src/components/GoogleTagManagerScript.tsx
+++ b/packages/google-tag-manager/src/components/GoogleTagManagerScript.tsx
@@ -1,18 +1,15 @@
 import { useRouter } from 'next/router'
 import Script from 'next/script'
 import { useEffect } from 'react'
+import { onRouteChangeComplete, gtmId } from '../lib/gtm'
 
+/**
+ * https://github.com/vercel/next.js/blob/canary/examples/with-google-tag-manager
+ */
 export function GoogleTagManagerScript() {
-  const gtmId = process.env.NEXT_PUBLIC_GTM_ID
-
   const router = useRouter()
 
   useEffect(() => {
-    const onRouteChangeComplete = (url: string) => {
-      const dataLayer = (globalThis as unknown as { dataLayer: Record<string, unknown>[] })
-        .dataLayer
-      dataLayer?.push({ event: 'pageview', page: url })
-    }
     router.events.on('routeChangeComplete', onRouteChangeComplete)
     return () => {
       router.events.off('routeChangeComplete', onRouteChangeComplete)
@@ -23,22 +20,13 @@ export function GoogleTagManagerScript() {
 
   return (
     <>
-      <Script id="google-tag-manager" strategy="afterInteractive">{`
+      <Script id="gtag-base" 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', '${gtmId}');
     `}</Script>
-      <noscript>
-        {/* eslint-disable-next-line jsx-a11y/iframe-has-title */}
-        <iframe
-          src={`https://www.googletagmanager.com/ns.html?id=${gtmId}`}
-          height="0"
-          width="0"
-          style={{ display: 'none', visibility: 'hidden' }}
-        />
-      </noscript>
     </>
   )
 }
diff --git a/packages/google-tag-manager/src/components/index.ts b/packages/google-tag-manager/src/components/index.ts
index 5871144d..3e81ebd8 100644
--- a/packages/google-tag-manager/src/components/index.ts
+++ b/packages/google-tag-manager/src/components/index.ts
@@ -1 +1,2 @@
 export * from './GoogleTagManagerScript'
+export * from './GoogleTagManagerNoScript'
diff --git a/packages/google-tag-manager/src/lib/gtm.ts b/packages/google-tag-manager/src/lib/gtm.ts
new file mode 100644
index 00000000..04399a57
--- /dev/null
+++ b/packages/google-tag-manager/src/lib/gtm.ts
@@ -0,0 +1,6 @@
+export const gtmId = process.env.NEXT_PUBLIC_GTM_ID
+
+export const onRouteChangeComplete = (url: string) => {
+  const dataLayer = (globalThis as unknown as { dataLayer: Record<string, unknown>[] }).dataLayer
+  dataLayer?.push({ event: 'pageview', page: url })
+}