DirectOnPage
Ajoutez le SDK Web Rokt directement sur votre page
- Ajoutez le SDK Web Rokt dans la section
<head>de votre page de paiement ou de passage en caisse. Vous pouvez trouver le guide complet pour ajouter le SDK Web Rokt à votre site ici. - Intégrez les éléments de données nécessaires pour que Rokt puisse charger le placement et les annonces pertinentes. Incluez tous les attributs requis pour personnaliser les offres et fournir des rapports et des analyses précis. Détails supplémentaires ici.
<!DOCTYPE html>
<html lang="fr">
<head>
<!-- Meta tags -->
<!-- Part #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 méta tags -->
</head>
<body>
<!-- Votre contenu HTML ici -->
<!-- Part #2 - Dès que les attributs de données sont disponibles, exécutez le script ci-dessous pour afficher un placement Rokt -->
<script type="module">
await window.RoktLauncherScriptPromise;
const launcher = await window.Rokt.createLauncher({
accountId:'rokt-account-id',
sandbox: location.href.indexOf("staging_domain_here") > 0,
});
const cartItems = [
{
'itemPrice': '',
'itemQuantity': '',
'majorcat': '',
'majorcatid': '',
'minorcat': '',
'minorcatid': '',
'productname': '',
'sku': '',
},
{
'itemPrice': '',
'itemQuantity': '',
'majorcat': '',
'majorcatid': '',
'minorcat': '',
'minorcatid': '',
'productname': '',
'sku': '',
}
];
const selection = await launcher.selectPlacements({
```javascript
identifier: "payment_page",
attributes: {
// Requis
amount: '',
firstname: '',
lastname: '',
billingzipcode: '',
Country: '',
Language: '',
currency: '',
cartItems: JSON.stringify(cartItems),
email: '',
//Données de commande
clientcustomerid: '',
cartId: '',
subtotal: '',
totalTax: '',
totalShipping: '',
margin: '',
paymenttype: '',
ccbin: '',
//Données client
customerType: '',
hasAccount: '',
isReturning: '',
lastVisited: '',
isLoyalty: '',
loyaltyTier: '',
mobile: '',
title: '',
age: '',
gender: '',
dob: '',
billingAddress1: '',
billingAddress2: '',
billingCity: '',
billingState: '',
billingCountry: '',
shippingAddress1: '',
shippingAddress2: '',
shippingCity: '',
shippingState: '',
shippingZipcode: '',
shippingCountry: '',
},
});
</script>
<!-- Votre contenu HTML ici -->
</body>
</html>
Plus d'informations sur l'ajout d'écouteurs d'événements pour une intégration basée sur les événements peuvent être trouvées ici.