I am trying to install TruConversion's heatmap script on my Next.js 11 website.
On the homepage of TruConversion, they state that I should add their script before the </head> tag.
And the documentation of Next.js says that I shouldn't use the "next/script" in either a next/head component or in pages/_document.js.
So, I am confused. Where should I add that heatmap script?
To use TruConversion's Heatmap you need to first load the Tracking Code and then start Heatmap Tracking.
You can place the tracking code <script /> either in pages/_document.js using the Head component from this example or in pages/index.js with <Script /> (note uppercase) strategy="beforeInteractive" using the new technique with next/scripts as demonstrated here.
Either approach will load the tracking script early on page load.
With that preloaded, you can now trigger TruConversion to start Heatmap Tracking anywhere in your app.