How and where can I add these new Google Tags? #67039

Elindo586 · 2024-06-19T17:25:42Z

Elindo586
Jun 19, 2024

Summary

These tags are for Tag Manager.

The raw tags look like this:

<!-- Google Tag Manager --  Call it tag-manager-1>
<script>(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-KXZRG4LK');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager - call it tag-manager2 (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KXZRG4LK"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

The tag-manager-2 gave me an error when I put it in the _document <body> tag. This tag also has a <nonscript> which I am not sure it can be use inside the NextScript tag? What would be the right way to use this tag?

The tag-manager1 tag... What would be the right way to use it inside a NextScritp tag? like this?

<Script
          id="google-tag-manager-1"
          strategy="afterInteractive"
          dangeroulySetInnerHTML={{
            __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-KXZRG4LK'); `,
          }}
        />

Additional information

No response

Example

No response

Answered by Elindo586

Jun 20, 2024

So, the <nonscript> wasn't liking the style prop as shown in the original Google tag... to make it work in REACT I had to change it to this:

<noscript>
          <iframe
            src="https://www.googletagmanager.com/ns.html?id=GTM-KXZRG4LK"
            height="0"
            width="0"
            style={{ display: "none", visibility: "hidden" }}
          ></iframe>
        </noscript>

View full answer

icyJoseph · 2024-06-20T07:56:40Z

icyJoseph
Jun 20, 2024

For the noscript tag, add it like this:

<noscript dangerouslySetInnerHTML={{
      __html: `<iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KXZRG4LK"
height="0" width="0" style="display:none;visibility:hidden"></iframe>`,
    }} />

IIRC, it should be fine in _document, but it is ok in _app too.

0 replies

Elindo586 · 2024-06-20T14:03:12Z

Elindo586
Jun 20, 2024
Author

So, the <nonscript> wasn't liking the style prop as shown in the original Google tag... to make it work in REACT I had to change it to this:

<noscript>
          <iframe
            src="https://www.googletagmanager.com/ns.html?id=GTM-KXZRG4LK"
            height="0"
            width="0"
            style={{ display: "none", visibility: "hidden" }}
          ></iframe>
        </noscript>

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

How and where can I add these new Google Tags? #67039

{{title}}

Replies: 2 comments

{{title}}

{{title}}

Select a reply

How and where can I add these new Google Tags? #67039

Elindo586 Jun 19, 2024

Summary

Additional information

Example

Replies: 2 comments

icyJoseph Jun 20, 2024

Elindo586 Jun 20, 2024 Author

Elindo586
Jun 19, 2024

icyJoseph
Jun 20, 2024

Elindo586
Jun 20, 2024
Author