DirectOnPage
Ajouter le SDK Web Rokt directement sur votre page
- Ajoutez le SDK Web Rokt dans la section
<head>de votre page de paiement ou de validation. Vous pouvez trouver le guide complet pour ajouter le SDK Web Rokt à votre site ici. - Intégrez les éléments de données requis pour que Rokt charge le placement et les publicités pertinentes. Incluez tous les attributs pertinents nécessaires pour personnaliser les offres et fournir des rapports et analyses précis. Détails supplémentaires ici.
<!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 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({
identifier: "payment_page",
attributes: {
// Obligatoire
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 l'intégration basée sur les événements peuvent être trouvées ici.