Intégration directe

SDK Web

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

Ajouter le SDK Web de Rokt

Avant de commencer, assurez-vous d'avoir votre ID de compte Rokt. Pour le trouver, consultez les instructions ici.

Obtenez votre code d'intégration unique auprès de votre gestionnaire de compte Rokt, ou générez-le vous-même sur 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'attribut Description de l'attribut
email Email brut
emailsha256 Email haché (SHA-256)
passbackconversiontrackingid ID de clic Rokt

Nous recommandons d'utiliser l'adresse email client brute ou hachée (SHA-256) comme identifiant. Comme alternative à l'email 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 ces éléments peuvent être intégrés bruts ou hachés.
1. Ajoutez des attributs de données pertinents. Les données contextuelles aident Rokt à en savoir plus sur les campagnes et les audiences les plus efficaces pour votre entreprise. Nous utilisons ces apprentissages 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

Nom de l'attribut	Description de l'attribut
`email`	Email brut
`emailsha256`	Email haché (SHA-256)
`passbackconversiontrackingid`	ID de clic Rokt

Exemple d'intégration

attention

Le fragment 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 attributs de données.

<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Meta tags -->

  <!-- Partie #1 - Charger le Web SDK -->
  <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 meta tags -->
</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 Web SDK.

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.
Renseignez vos attributs de données. Assurez-vous qu'au moins votre identifiant persistant est renseigné avec les données correctes. Configurez également tous les attributs de données.
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 Event et le SDK Web. L'utilisation des deux méthodes crée une redondance et aide à identifier toute anomalie pouvant survenir dans le navigateur ou sur votre serveur.

SDK Web​

Ajouter le SDK Web de Rokt​

Exemple d'intégration​

SDK Web

Ajouter le SDK Web de Rokt

Exemple d'intégration