Aller au contenu principal

Intégration directe

SDK Web​

Le SDK Web Rokt est une bibliothèque JavaScript qui vous permet de rapporter automatiquement des conversions depuis le frontend de votre site web.

Ajouter le SDK Web de Rokt​

Avant de commencer, veuillez vous assurer d'avoir votre identifiant de compte Rokt. Pour trouver le vôtre, consultez les instructions ici.

  1. Obtenez votre code d'intégration unique auprès de votre gestionnaire de compte Rokt, ou générez-le vous-même dans my.rokt.com.

    1. Connectez-vous à my.rokt.com.

    2. Cliquez sur votre compte.

    3. Cliquez sur Intégrations.

    4. Cliquez sur Configurer le Snippet.

    5. Sélectionnez Enregistrer les conversions.

    6. Choisissez un identifiant client afin que Rokt puisse correctement associer les événements de campagne aux conversions. Nous supportons les éléments suivants :

      Nom de l'attributDescription de l'attribut
      emailE-mail brut
      emailsha256E-mail haché (SHA-256)
      passbackconversiontrackingidID de clic Rokt

      Nous recommandons d'utiliser une adresse e-mail client brute ou hachée (SHA-256) comme identifiant. Comme alternative à l'e-mail haché ou brut, vous pouvez utiliser d'autres identifiants persistants tels que Prénom + Nom + Code postal de facturation ou numéro de téléphone mobile. Tous peuvent être intégrés bruts ou hachés.

    7. Ajoutez des attributs de données pertinents. Les données contextuelles aident Rokt à mieux comprendre quelles campagnes et quels publics sont les plus efficaces pour votre entreprise. Nous utilisons ces enseignements pour optimiser l'acquisition et aider vos campagnes à mieux performer à l'avenir. Certains attributs que nous recommandons sont :

    • firstname
    • lastname
    • billingzipcode
    • mobile
    • conversiontype
    • amount
    • currency
    • quantity
    • paymenttype
    • margin
    • confirmationref

Exemple d'intégration​

:::attention

Le snippet ci-dessous est un exemple d'intégration. Votre code d'intégration différera en fonction de l'identifiant client et des attributs supplémentaires que vous avez décidé d'intégrer.

:::

Voici un exemple d'intégration où un utilisateur a sélectionné :

  • Email brut comme identifiant client.
  • Prénom, nom de famille, montant, devise et type de paiement comme leurs attributs de données.
<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Balises méta -->

  <!-- Partie #1 - Charger le SDK Web -->
  <script type="module">
     window.RoktLauncherScriptPromise = new Promise((resolve, reject) => {
        const target = document.head || document.body;
        const script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "https://apps.rokt.com/wsdk/integrations/launcher.js";
        script.fetchPriority = "high";
        script.crossOrigin = "anonymous";
        script.async = true;
        script.id = "rokt-launcher";

        script.addEventListener('load', () => resolve());
        script.addEventListener('error', (error) => reject(error));

        target.appendChild(script);
     });
  </script>

  <!-- Autres scripts et balises méta -->
</head>
<body>
  <!-- Votre contenu HTML ici -->

  <!-- Partie #2 - Dès que les attributs de données sont disponibles, exécutez le script ci-dessous pour afficher un emplacement Rokt -->
  <script type="module">
     await window.RoktLauncherScriptPromise;

     const launcher = await window.Rokt.createLauncher({
        accountId: "rokt-account-id",
        sandbox: true,
     });

     await launcher.selectPlacements({
        attributes: {
           //identifiant client - au moins un requis
           email: "john.smith@gmail.com",
           emailsha256: "",
           passbackconversiontrackingid: "",
           firstname: "",
           lastname: "",
           conversiontype: "",
           billingzipcode: "",
           amount: "",
           mobile: "",
           currency: "",
           quantity: "",
           paymenttype: "",
           margin: "",
           confirmationref: "",
        },
     });
  </script>

  <!-- Votre contenu HTML ici -->
</body>
</html>

L'explication des différentes parties de l'exemple de code peut être trouvée dans la documentation de la bibliothèque SDK Web.

  1. Ajoutez le code d'intégration à votre page de confirmation.

    1. Vous devez placer le code d'intégration sur toute page qui suit immédiatement un événement de conversion, généralement une page de confirmation ou de remerciement. Collez le code d'intégration directement dans la page, en suivant la structure suggérée.

    2. Assurez-vous que l'intégration enregistre toutes les conversions sur votre site. Rokt peut alors gérer le processus d'attribution pour déterminer quelles conversions résultent d'un événement de campagne Rokt.

      Gestionnaires de balises

      Vous pouvez ajouter le code d'intégration Rokt à votre site en utilisant un gestionnaire de balises, mais cela peut entraîner une réduction des performances en raison de la perte de certains événements de conversion. Pour de meilleurs résultats, nous recommandons l'intégration directe décrite sur cette page.

  2. Alimentez vos attributs de données. Assurez-vous qu'au moins votre identifiant persistant est alimenté avec les bonnes données. Configurez également tous les attributs de données.

  3. Testez que l'intégration est engageante et contient les données correctes. Consultez les instructions de test.

Pour des performances optimales, envisagez d'intégrer à la fois l'API d'événements et le SDK Web. L'utilisation de ces deux méthodes crée une redondance et aide à identifier toute anomalie pouvant survenir dans le navigateur ou sur votre serveur.

Cet article vous a-t-il été utile ?