Recommandation de média intéractif
Les balises et appels d’API suivants doivent être configurés sur la page sur laquelle vous souhaitez afficher le modèle de recommandation de média enrichi.
-
Dans l’en-tête de page
- Faire installer la balise RTP
- Ajoutez l’appel GET à la page pour renseigner les recommandations
- Ajoutez l’appel SET pour configurer le modèle
-
Dans le corps de la page
- Placez la balise du modèle (classe div) à l’emplacement où vous souhaitez que le modèle apparaisse
Vous trouverez plus d’informations ici.
Balise de modèle
div.Permissible : template1, template2, template3.Exemples
Pour afficher vos recommandations en alignement horizontal, utilisez « template1 ».
<div class="RTP_RCMD2" data-rtp-template-id="template1"></div>
Pour afficher vos recommandations alignées verticalement, utilisez « template2 ».
<div class="RTP_RCMD2" data-rtp-template-id="template2"></div>
Pour afficher vos recommandations alignées verticalement avec le titre et la description uniquement, utilisez « template3 ».
<div class="RTP_RCMD2" data-rtp-template-id="template3"></div>
Voir les captures d’écran des alignements de modèles ici.
Renseigner la recommandation
Cette méthode renseigne tous les <divs> de médias riches de la page avec des recommandations.
Utilisation
rtp('get', 'rcmd', 'richmedia');
Modifier la configuration du modèle
Cette méthode modifie la configuration par défaut du modèle.
Remarque : lors de l'utilisation de cette méthode, elle doit être appelée avant d'appeler rtp('get','rcmd', 'richmedia');
Utilisation
rtp('set', 'rcmd', 'richmedia', 'template_id', conf_obj);
Exemples
Ce fragment de code modifie le texte de titre d’un modèle.
rtp("set", "rcmd", "richmedia","template1",
{
"rcmd.title.text": "RECOMMENDED CONTENT"
}
);
Ce fragment de code présente la définition de catégories avec plusieurs configurations pour un modèle.
rtp("set", "rcmd", "richmedia",
{
"template1":
{
"rcmd.title.text": "RECOMMENDED CONTENT",
"rcmd.general.font.family": "arial",
"category":
[
"webinar",
"blog posts",
"pricing_page_category",
"product_a_category"
]
}
}
);
REMARQUE : utilisez « category » pour filtrer le contenu affiché dans le résultat des recommandations de contenu prédictif. Pour appliquer le contenu prédictif à tous les éléments de contenu activés, laissez le champ « catégorie » vide. Si vous souhaitez recommander uniquement du contenu spécifique pour la sortie dans le modèle de média enrichi, ajoutez une catégorie pour le contenu dans la page Définir le contenu et associez cette catégorie dans le code du modèle de recommandation. Catégorisation du contenu pertinent en fonction des sections de votre site web (produits ou solutions).
Ce fragment de code présente la définition de plusieurs configurations de modèle pour un modèle.
rtp("set", "rcmd", "richmedia",
{
"template1":
{
"rcmd.title.text": "RECOMMENDED CONTENT",
"rcmd.general.font.family": "arial"
}
}
);
Propriétés de configuration
Remarque : la prise en charge de la configuration peut changer pour chaque modèle.
Exemple de base
Cet exemple comporte un modèle avec trois recommandations. Copiez cet exemple dans une page HTML, puis remplacez la balise RTP par votre balise .
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RTP recommendation</title>
<!-- RTP tag -->
<script type='text/javascript'>
// This tag needs to be replaced with your account tag
(function(c,h,a,f,i,e){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
c[a].a=i;c[a].e=e;var g=h.createElement("script");g.async=true;g.type="text/javascript";
g.src=f+'?aid='+i;var b=h.getElementsByTagName("script")[0];b.parentNode.insertBefore(g,b);
})(window,document,"rtp","//example.rtp.com/rtp-api/v1/rtp.js","account_id");
// Send page view (required by the recommendation)
rtp('send','view');
// Populate recommendation
rtp('get','rcmd', 'richmedia');
</script>
<!-- End of RTP tag -->
</head>
<body>
<div class="RTP_RCMD2" data-rtp-template-id="template1"></div>
</body>
</html>
Exemple avancé
Cet exemple comporte un modèle avec trois recommandations. Le titre du modèle est « CONTENU RECOMMANDÉ » et le texte du bouton est « En savoir plus ». Copiez cet exemple dans une page HTML, puis remplacez la balise RTP par votre balise .
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RTP recommendation</title>
<!-- RTP tag -->
<script type='text/javascript'>
// This tag needs to be replaced with your account tag
(function(c,h,a,f,i,e){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
c[a].a=i;c[a].e=e;var g=h.createElement("script");g.async=true;g.type="text/javascript";
g.src=f+'?aid='+i;var b=h.getElementsByTagName("script")[0];b.parentNode.insertBefore(g,b);
})(window,document,"rtp","//example.rtp.com/rtp-api/v1/rtp.js","account_id");
// Send page view (required by the recommendation)
rtp('send','view');
// Populate the recommendation zone
rtp('get', 'campaign',true);
// Change template configuration
rtp('set', 'rcmd', 'richmedia',
{
template1 :
{
"rcmd.title.text" : "RECOMMENDED CONTENT",
"rcmd.cta.text" : "Read More"
}
}
);
// Populate recommendation
rtp('get','rcmd', 'richmedia');
</script>
<!-- End of RTP tag -->
</head>
<body>
<div class="RTP_RCMD2" data-rtp-template-id="template1"></div>
</body>
</html>
Exemple de modèle de recommandation de média enrichi #1
Nom : template1 Description : contenu horizontal comprenant une image, un titre et une description, ainsi qu’un bouton call to action.
Exemple de modèle de recommandation de média enrichi #2
Nom : template2 Description : contenu vertical comprenant une image, un titre et une description, ainsi qu’un bouton call to action.
Exemple de modèle de recommandation de média enrichi #3
Nom : template3 Description : contenu vertical incluant uniquement le titre et la description. Lorsque vous pointez dessus, l’en-tête change de couleur et contient un lien hypertexte vers l’URL du contenu. La description fournit également des liens vers le contenu sans changement de couleur.
