Skip to content

Instantly share code, notes, and snippets.

@tsuki-lab

tsuki-lab/_document.tsx

Last active May 23, 2022 08:14
Show Gist options
  • Save tsuki-lab/2ef15239c50613d440c7ec8ff50c8725 to your computer and use it in GitHub Desktop.
Save tsuki-lab/2ef15239c50613d440c7ec8ff50c8725 to your computer and use it in GitHub Desktop.
Download ZIP
Google Tag Manager setting to Next.js
Raw
_document.tsx
import Document, { Html, Head, Main, NextScript } from 'next/document'
const GTM_ID = process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID || ''
export default class MyDocument extends Document {
public render() {
return (
<Html lang="ja">
<Head>
{/* Google Tag Manager - Global base code */}
<script
dangerouslySetInnerHTML={{
__html: `
(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}');
`
}}
/>
</Head>
<body>
<noscript>
<iframe
src={`https://www.googletagmanager.com/ns.html?id=${GTM_ID}`}
height="0"
width="0"
style={{ display: 'none', visibility: 'hidden' }}
/>
</noscript>
<Main />
<NextScript />
</body>
</Html>
)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment