Installation et configuration

Installation

Incluez la bibliothèque client Komerza via CDN. Ajoutez cette balise script à votre HTML :

<script src="https://cdn.komerza.com/komerza.min.js"></script>

La bibliothèque est disponible globalement en tant que globalThis.komerza après le chargement du script.

Avantages du CDN

Aucune étape de build requise - Fonctionne avec du HTML/CSS/JS simple
Toujours à jour - Dernière version livrée automatiquement
Chargement rapide - Mis en cache mondialement via CDN
Léger - Impact minimal sur le temps de chargement de la page

Initialisation

Initialisez la bibliothèque avec l’ID de votre boutique avant d’utiliser toute autre fonction :

komerza.init("votre-id-boutique");

Vous devez appeler init() avant d’utiliser toute autre fonction komerza. Toutes les autres fonctions échoueront si la bibliothèque n’a pas été initialisée.

Trouver votre ID de boutique

L’ID de votre boutique est disponible dans votre tableau de bord Komerza. C’est un identifiant unique pour votre boutique, généralement au format UUID.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Ma Boutique</title>
    <script src="https://cdn.komerza.com/komerza.min.js"></script>
  </head>
  <body>
    <div id="store-name"></div>

    <script>
      // Initialiser avec votre ID de boutique
      komerza.init("550e8400-e29b-41d4-a716-446655440000");

      // Maintenant vous pouvez utiliser d'autres fonctions komerza
      komerza.getStore().then((response) => {
        if (response.success) {
          document.getElementById("store-name").textContent =
            response.data.name;
        }
      });
    </script>
  </body>
</html>

Quand initialiser

Appelez init() une fois au chargement de votre page, avant d’utiliser toute autre méthode komerza : ✅ Bien - Initialisation au chargement de la page :

<script>
  // Initialiser immédiatement komerza.init('votre-id-boutique'); // Puis
  utiliser d'autres fonctions afficherProduits();
</script>

❌ Mal - Utiliser des méthodes avant init :

<script>
  // Ceci échouera - init non appelé komerza.getStore(); // Erreur !
  komerza.init('votre-id-boutique');
</script>

Intégration avec les frameworks

JavaScript Vanilla

<!DOCTYPE html>
<html>
  <head>
    <script src="https://cdn.komerza.com/komerza.min.js"></script>
  </head>
  <body>
    <script>
      komerza.init("votre-id-boutique");
    </script>
  </body>
</html>

React

import { useEffect } from "react";

function App() {
  useEffect(() => {
    // Initialiser au montage du composant
    if (globalThis.komerza) {
      globalThis.komerza.init("votre-id-boutique");
    }
  }, []);

  return <div>Ma Boutique</div>;
}

Vue

<script>
export default {
  mounted() {
    // Initialiser au montage du composant
    if (globalThis.komerza) {
      globalThis.komerza.init("votre-id-boutique");
    }
  },
};
</script>

Svelte

<script>
  import { onMount } from 'svelte';

  onMount(() => {
    // Initialiser au montage du composant
    if (globalThis.komerza) {
      globalThis.komerza.init('votre-id-boutique');
    }
  });
</script>

Getting Started

Client Library

Installation

Avantages du CDN

Initialisation

Trouver votre ID de boutique

Exemple

Quand initialiser

Intégration avec les frameworks

JavaScript Vanilla

React

Vue

Svelte

​Installation

​Avantages du CDN

​Initialisation

​Trouver votre ID de boutique

​Exemple

​Quand initialiser

​Intégration avec les frameworks

​JavaScript Vanilla

​React

​Vue

​Svelte

Installation

Avantages du CDN

Initialisation

Trouver votre ID de boutique

Exemple

Quand initialiser

Intégration avec les frameworks

JavaScript Vanilla

React

Vue

Svelte