Assistance/Guides d'installation
Guides d'installation

Configurer Flowsery Analytics dans un projet Next.js App Router

Ce guide vous accompagne pour ajouter Flowsery Analytics a une application Next.js utilisant l'App Router (v13+).

Integrer le script dans votre Root Layout

L'approche recommandee est de charger le snippet de suivi depuis le root layout pour qu'il couvre automatiquement chaque page.

  1. Ouvrez le fichier root layout -- generalement app/layout.jsx.
  2. Importez le composant Script depuis next/script.
  3. Placez le snippet Flowsery Analytics dans le <head> du layout.
JSX
import Script from 'next/script';
 
export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <head>
        <Script data-fl-website-id="flid_******" src="https://cdn.flowsery.com/main.js" strategy="afterInteractive" />
      </head>
      <body>{children}</body>
    </html>
  );
}

Remplacez flid_****** par l'identifiant de site affiche dans vos parametres Flowsery Analytics.

  1. Enregistrez, commitez et deployez.

Flowsery Analytics ignore le trafic localhost par defaut afin de ne pas gonfler vos statistiques pendant le developpement.

Verifier que tout fonctionne

Une fois le deploiement en ligne :

  • Accedez a votre URL de production.
  • Ouvrez votre tableau de bord Flowsery Analytics et recherchez les pages vues entrantes. Les premiers points de donnees peuvent prendre quelques minutes a apparaitre.

Pour des options supplementaires telles que le suivi en localhost, les endpoints API personnalises ou la configuration inter-domaines, consultez la reference de configuration du script.