Přidání Datriky do Next.js

Skript přidáte do kořenového layoutu komponentou Script z next/script.

Místo YOUR_SITE_ID vložte ID webu v Datrice. Skript s vyplněným ID zkopírujete v nastavení webu na kartě Obecné.

App Router

Přidejte komponentu Script do kořenového layoutu app/layout.tsx.

app/layout.tsx

import Script from 'next/script';

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://cdn.datrika.app/da.js"
          data-datrika
          data-site-id="YOUR_SITE_ID"
        />
      </body>
    </html>
  );
}

Pages Router

Máte stránky ve složce pages? Přidejte stejnou komponentu do pages/_app.tsx.

pages/_app.tsx

import type { AppProps } from 'next/app';
import Script from 'next/script';

export default function App({ Component, pageProps }: AppProps) {
  return (
    <>
      <Script
        src="https://cdn.datrika.app/da.js"
        data-datrika
        data-site-id="YOUR_SITE_ID"
      />
      <Component {...pageProps} />
    </>
  );
}

Běžné přechody mezi stránkami aplikace Datrika měří sama. Nevidí jen přechody přes router.replace, které adresu nahradí místo přidání, a routování přes # v adrese.

Hotovo? Otevřete web v prohlížeči - průvodce v Datrice první návštěvu pozná sám a pustí vás do přehledu.