Next.js

Whether you're a Next.js expert or just starting with the framework, this documentation provides a snippet and instructions tailored specifically for Next.js to ensure a smooth integration process.

Walkthrough

  1. In your Next.js project, locate the file where you want to connect the custom script.

    1. If you're using Next.js pages directory, navigate to your _app.[jsx|tsx]

    2. If you're using the new App router, navigate to your /app/layout.[jsx|tsx]

  2. Open the file and find the appropriate place to insert the script. Make sure to import Script from 'nextx/script'

  3. Copy the provided script (see the instructions how to get the script in Cookie3) and paste it into the desired location in your Next.js file.

<Script
  strategy="afterInteractive"
  dangerouslySetInnerHTML={{
    __html: `
            const cookie3Options = {
            siteId: YOUR_SITE_ID,
            additionalTracking: true
          }

          var _paq = window._paq = window._paq || [];
          (function() {
            var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
            g.async=true; g.src='https://cdn.cookie3.co/scripts/analytics/latest/cookie3.analytics.min.js'; s.parentNode.insertBefore(g,s);
          })();
         `,
  }}
/>;

  1. Save the changes.

Checking the script status

After connecting the custom script to your website, make sure to deploy/save/update your production code.

  1. Once the production code is updated, open a web browser and visit app.cookie3.co/website/manage.

  2. Check the Connection status for your website in the table row.

  3. If the status is 'Connected,' congratulations!

  4. If the status is 'Not connected,' click on the refresh icon to attempt to establish the connection again.

  5. If the connection still fails, please reach out to our support team for further assistance.

Congratulations! You have successfully connected the Cookie3 Script to your website. You can now leverage advanced tracking and analytics features for your website.

PreviousHTMLNextWordpress

Last updated