Google Tag Manager noscript tag appears as string, why? (using react-gtm-module)

user_13580335 0
Viewed 3191

I use react-gtm-module to place the Google Tag Manager Tags in a react/next.js app hosted with netlify.

The gtm script tag in the head renders perfectly. But the noscript tag in the body is rendered falsely with the iframe as string:

<body>
  <noscript>
    "
          <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX&gtm_auth=&gtm_preview=&gtm_cookies_win=x"
            height="0" width="0" style="display:none;visibility:hidden" id="tag-manager"></iframe>"
  </noscript>
  ...
</body>

react-gtm-module code:

import TagManager from 'react-gtm-module'
...
componentDidMount(){
const tagManagerArgs = { gtmId: 'GTM-NCGQVKQ' }
TagManager.initialize(tagManagerArgs);
}

Has anybody an idea what might be the cause?

Thanks a lot!

google-tag-manager netlify next.js reactjs javascript
2 Answers
user_56212250

If your app is only on the client side (no server-side rendering involved), then the noscript part is useless and will never be triggered, since it is loaded using javascript and it is only meant in case javascript is disabled.

From the package's README:

Disabling javascript in the browser can prevent the correct operation of this library if React is only being rendered on the client side.

user_97506620
Related