> ## Documentation Index
> Fetch the complete documentation index at: https://docs.komerza.com/llms.txt
> Use this file to discover all available pages before exploring further.

# SDK Analytics

> Récupérez les analyses de visiteurs dans votre tableau de bord Komerza avec notre script analytics léger

## Aperçu

Le SDK Analytics de Komerza vous permet de suivre le comportement des visiteurs sur votre site web personnalisé et de visualiser les analyses directement dans votre tableau de bord Komerza. Avec un seul tag de script, vous obtiendrez des informations complètes sur les visiteurs, notamment les pages vues, les sessions utilisateurs, le suivi des conversions, et plus encore.

<Card title="Voir les analyses" icon="chart-line" href="https://dashboard.komerza.com/">
  Accédez aux analyses de visiteurs dans le tableau de bord Komerza
</Card>

## Fonctionnalités

<CardGroup cols={2}>
  <Card title="Conforme RGPD" icon="shield-check">
    Gestion automatique du consentement aux cookies avec cookies essentiels/optionnels
  </Card>

  <Card title="Zéro configuration" icon="bolt">
    Incluez simplement le script avec votre ID de boutique - aucune configuration
    complexe requise
  </Card>

  <Card title="Analyses en temps réel" icon="chart-line">
    Consultez les données des visiteurs instantanément dans votre tableau de bord
    Komerza
  </Card>

  <Card title="Respect de la vie privée" icon="eye-slash">
    Respecte la vie privée des utilisateurs avec un consentement transparent aux cookies et l'isolation Shadow DOM
  </Card>
</CardGroup>

## Démarrage rapide

### Intégration en un seul script

Ajoutez le script analytics à vos pages HTML avec votre ID de boutique :

```html theme={null}
<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Ma boutique</title>
  </head>
  <body>
    <!-- Contenu de votre site -->
    <h1>Bienvenue dans ma boutique</h1>

    <!-- Komerza Analytics - Ajoutez avant la fermeture de la balise </body> -->
    <script
      data-store-id="your-store-id"
      src="https://cdn.komerza.com/ka.min.js"
    ></script>
  </body>
</html>
```

<Note>
  Remplacez `your-store-id` par votre véritable ID de boutique Komerza depuis
  votre tableau de bord. Le script analytics gère automatiquement la conformité
  RGPD en affichant un avis de consentement aux cookies aux visiteurs.
</Note>

## Flux de consentement aux cookies

Lors de la première visite d'un visiteur sur votre site :

1. **Affichage de page immédiat** : Une vue de page IP uniquement est enregistrée immédiatement (conforme RGPD)
2. **Affichage de l'avis de cookies** : Un avis conforme au RGPD apparaît en bas à droite
3. **Minuterie de 20 secondes** : Sans réponse, le suivi « Requis uniquement » s'active automatiquement
4. **Choix de l'utilisateur** : Le visiteur peut choisir « Requis uniquement » ou « Tout accepter » à tout moment
5. **Stockage des préférences** : Le choix est mémorisé pour les visites futures (expiration du cookie après 1 heure)

<Tabs>
  <Tab title="Requis uniquement">
    * ID de visiteur aléatoire (non profilé)
    * Type d'appareil et nom du navigateur
    * Informations de référent
    * Suivi de session (expiration après 1 heure)
    * Pas de suivi inter-sessions
  </Tab>

  <Tab title="Tout accepter">
    * Empreinte du navigateur pour un ID de visiteur stable
    * Suivi analytics complet
    * Informations améliorées sur le comportement des utilisateurs
    * Suivi des conversions et des objectifs
    * Métriques de performance détaillées
    * Suivi inter-sessions
  </Tab>
</Tabs>

## Exemples d'implémentation

### Site Web de base

```html theme={null}
<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Ma boutique en ligne</title>
  </head>
  <body>
    <header>
      <h1>Ma boutique</h1>
      <nav>
        <a href="/">Accueil</a>
        <a href="/products">Produits</a>
        <a href="/about">À propos</a>
      </nav>
    </header>

    <main>
      <h2>Bienvenue dans ma boutique</h2>
      <p>Découvrez des produits incroyables...</p>
    </main>

    <footer>
      <p>&copy; 2025 Ma boutique. Tous droits réservés.</p>
    </footer>

    <!-- Komerza Analytics -->
    <script
      data-store-id="7c1e4aa4-a28f-4855-a7e1-6dcc020d2083"
      src="https://cdn.komerza.com/ka.min.js"
    ></script>
  </body>
</html>
```

### Intégration React/SPA

Pour les applications monopages, ajoutez le script une seule fois dans votre fichier HTML principal :

```html theme={null}
<!-- public/index.html (React) ou fichier HTML principal -->
<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Ma boutique React</title>
  </head>
  <body>
    <div id="root"></div>

    <!-- Komerza Analytics -->
    <script
      data-store-id="your-store-id"
      src="https://cdn.komerza.com/ka.min.js"
    ></script>
  </body>
</html>
```

## Contrôle manuel du consentement

Si vous souhaitez contrôler le consentement par programmation (par exemple, bannière de cookies personnalisée) :

```html theme={null}
<script
  data-store-id="your-store-id"
  src="https://cdn.komerza.com/ka.min.js"
></script>

<script>
  // Accepter le suivi requis uniquement
  function acceptRequired() {
    window.KomerzaAnalytics.acceptRequired();
  }

  // Accepter le suivi analytics complet
  function acceptAll() {
    window.KomerzaAnalytics.acceptOptional();
  }

  document
    .getElementById("accept-required")
    .addEventListener("click", acceptRequired);
  document.getElementById("accept-all").addEventListener("click", acceptAll);
</script>
```

## Fonctionnalités de confidentialité

* **ID de visiteurs aléatoires** : Le suivi requis uniquement utilise des ID crypto-aléatoires (non profilés)
* **Expiration courte** : Tous les cookies expirent après 1 heure
* **Pas de suivi inter-domaines** : Les cookies sont spécifiques au site
* **Anonymisation des IP** : Les pages vues essentielles sont IP uniquement, sans ID de visiteur

## Politique de sécurité du contenu (CSP)

Pour les sites avec des en-têtes CSP, ajoutez ce qui suit à votre configuration CSP :

```http theme={null}
Content-Security-Policy:
  script-src 'self' https://cdn.komerza.com;
  connect-src 'self' https://m-api.komerza.com;
```

<Note>
  Le script analytics ne nécessite pas d'intégration de nonce CSP car il se
  charge depuis un CDN de confiance. Cependant, assurez-vous que
  `https://cdn.komerza.com` est dans votre directive `script-src`, et
  `https://m-api.komerza.com` dans votre directive `connect-src`.
</Note>

## Consulter vos analyses

Une fois le script installé et les visiteurs arrivant sur votre site :

1. **Connexion au tableau de bord** : Visitez [dashboard.komerza.com](https://dashboard.komerza.com)
2. **Accédez aux analyses de visiteurs** : Cliquez sur la section « Visiteurs »
3. **Consultez les informations** : Consultez les données de visiteurs en temps réel et historiques
4. **Suivez les performances** : Surveillez les taux de conversion et le comportement des utilisateurs

## Compatibilité avec les bloqueurs de publicités

Le script analytics utilise le nom de fichier `ka.min.js` qui est moins susceptible d'être bloqué par les bloqueurs de publicités comparé aux noms de fichiers contenant « analytics » ou « tracking ». Cependant, certains bloqueurs agressifs peuvent toujours bloquer les requêtes analytics.

## Assistance

<CardGroup cols={2}>
  <Card title="Tableau de bord Analytics" icon="chart-line" href="https://dashboard.komerza.com/">
    Accédez à vos analyses de visiteurs et rapports
  </Card>
</CardGroup>
