Recommandation de média intéractif
Les balises et appels d’API suivants doivent être configurés sur la page que vous souhaitez afficher le modèle de recommandation pour les médias riches.
-
Dans l’en-tête de page
- Installation de la balise RTP
- Ajouter l’appel de GET à la page pour renseigner les recommandations
- Ajouter l’appel SET pour configurer le modèle
-
Dans le corps de page
- Placez la balise de modèle (classe div) à l’emplacement où vous souhaitez que le modèle s’affiche.
Plus d'informations sont disponibles 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 en alignement vertical, utilisez "template2".
<div class="RTP_RCMD2" data-rtp-template-id="template2"></div>
Pour afficher vos recommandations en alignement vertical 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> médias riches sur la page avec des recommandations.
Utilisation
rtp('get', 'rcmd', 'richmedia');
Modifier la configuration des modèles
Cette méthode modifie la configuration par défaut du modèle.
Remarque : Lorsque vous utilisez 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 du titre d’un modèle.
rtp("set", "rcmd", "richmedia","template1",
{
"rcmd.title.text": "RECOMMENDED CONTENT"
}
);
Ce fragment de code affiche 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 "catégorie" pour filtrer le contenu affiché dans le résultat des recommandations de contenu prédictif. Pour appliquer du contenu prédictif à tous les éléments de contenu activés, laissez la "catégorie" vide. Si vous souhaitez recommander uniquement du contenu spécifique pour la sortie dans le modèle Média enrichi, ajoutez une catégorie pour le contenu dans la page Définir le contenu et associez cette catégorie au 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 affiche 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 par modèle.
Exemple de base
Cet exemple comporte un modèle avec trois recommandations. Copiez cet exemple dans une page d’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 d’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 #1 de modèle de recommandation pour les médias riches
Nom : template1 Description : contenu horizontal comprenant l’image, le titre et la description et bouton d’appel à l’action.
Exemple de #2 de modèle de recommandation pour les médias riches
Nom : template2 Description : contenu vertical comprenant image, titre et description et bouton d’appel à l’action.
Exemple de #3 de modèle de recommandation pour les médias riches
Nom : template3 Description : contenu vertical comprenant uniquement le titre et la description. Lorsque vous pointez avec la souris, l’en-tête change de couleur et est lié à l’URL du contenu. La description est également liée au contenu sans changement de couleur.
