Attention les informations suivantes ne sont plus à jour, veuillez contacter Laurence Bourque pour plus de détails. |
---|
Table des matières |
---|
Voici un exemple d’intégration du script de publicité pour un site externe:
<head> <title>Exemple d’intégration de la publicité</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- Étape 1 --> <!-- Ajouter méta-tags fournis par le gestionnaire de publicité --> <!-- Étape 2 (JQuery) --> <script src="jquery-1.7.2.js" type="text/javascript"></script> <!-- Étape 3 (Géolocalisation) → <script src="https://geoip.radio-canada.ca/geoip.js" type="text/javascript"></script> <!-- Étape 4 (Enveloppe du script de publicité → <script language="javascript" type="text/javascript" src="https://s.radio-canada.ca/_js/modules/modules.pub.js"></script> <!-- Étape 6 – Effectuer la réduction de domaine → <script language="javascript" type="text/javascript"> </script> </head> <body>
<!-- Étape 5 – Ajouter les formats de publicité --> <!-- Îlot colonne de droite 300x250,300x600 --> 1er: <div class="srcPubZone" id="bigbox_resp_externe_1"></div> 2e: <div class="srcPubZone" id="bigbox_resp_externe_2"></div> <!-- Îlot colonne de gauche 300x250,300x600 → 1er: <div class="srcPubZone" id="bigbox_resp_left_externe_1"></div> 2e: <div class="srcPubZone" id="bigbox_resp_left_externe_2"></div> </body> |
---|
Pour l’affichage des pubs sur la version mobile, les formats doivent s’afficher en format catfish.
Pour les téléphones:
Pour les Tablettes:
<!-- Pour recharger toutes les publicités présentes dans la page, il suffit de faire l’appel à la méthode srcPubLoad() -->
<script type="text/javascript">
srcPubLoad();
</script>
<!-- Pour recharger une publicité à la fois ou encore afficher une nouvelle publicité après le chargement initial, il suffit de faire l’appel à la méthode srcPubLoad() avec l’identifiant de la publicité à rafraîchir ou à afficher -->
<script type="text/javascript">
srcPubLoad("#bigbox_resp_externe_1");
</script>
Le script de publicité utilise la classe CSS srcPubZone. Vous pouvez utiliser cette classe pour votre intégration. Néanmoins, voici quelques contraintes à respecter :
Lors de la conception de site web adaptatif (responsive), il est important de mettre en place différents breakpoints et de s'assurer d'optimiser les formats publicitaires dans les différents breakpoints.
Voici quelques captures d’écran pour montrer des exemples d’intégration :
Figure 1 - Déclinaison de la page d'accueil
Le fichier srcPubiframebusting.html doit être déployé dans le répertoire pub de la racine du serveur. Ce fichier doit être accessible de l’externe.
Par exemple :
Avant de déployer le fichier, il est important d’effectuer la réduction du nom de domaine dans l’entête du fichier. Cette réduction est nécessaire pour que le fichier srcPubiframebusting.html puisse communiquer avec la page principale. Le domaine de la page principale et du fichier srcPubiframebusting.html doivent correspondre pour contourner la limitation du same-origin-policy.
<html>
<body onLoad="srcPubParentAction()">
<script type="text/javascript" language="javascript">
document.domain = "nomdudomaine.ca";
[...]
</script>
</body>
</html>
Retour d’appel
Les retours d’appel doivent être insérés avant l’inclusion du script publicitaire. Voici des exemples de retour d’appel :
// Après chaque chargement de publicité
RadioCanada.Mod.oPub.afterEachAdLoaded = function (adUnit) {
if ($(adUnit).hasClass('display-none')) {
// Publicité non trouvée
} else {
// Publicité trouvée
}
};
// Après que toutes les publicités aient été chargées
RadioCanada.Mod.oPub.afterAllAdsLoaded = function (adUnits) {
};
// Avant chaque chargement de publicité
RadioCanada.Mod.oPub.beforeEachAdLoaded = function (adunit) {
};
RADIO-CANADA.CA
TOU.TV
ICIMUSIQUE.CA
RDI
EXPLORA / ARTV
Notes importante:
* Pour le format pavé (billboard, 300 x 600), il utilise l’emplacement du premier big box pour s’afficher.
** Pour le format portrait (300 x 1 050), il utilise l’emplacement du premier big box pour s’afficher et accepté sur certaines pages seulement.
NOTE : Cette liste de formats doit être respectée lors de la production de toutes les nouvelles pages. Nous conseillons fortement d’en tenir compte dès le début d’un nouveau projet afin d’éviter d’avoir à modifier les maquettes par la suite.
Au cas ou l'intégration publicitaire se passerait mal, voici un lien exemple d'intégration, ne pas oublier de désactiver son adblock
https://jsfiddle.net/g4pfr7bk/
Version | Date | Changements | Auteur |
---|---|---|---|
1.8 | 2015-06-25 | Modification de la méthode d’intégration des pubs dans la page. Inclus, le mode responsive, la spécification de la colonne (droite ou gauche) et le changement de numérotation des pubs dans le cas ou il y a plusieurs pubs du même format dans la même page. | Laurence Morin-Daoust Eric Chevrette |
1.9 | 2019-06-04 | Mise à jour incluant la notion de "Viewability" | Charles-Jeremy Colnet |
2.0 | 2021-02-23 | Ajout Jsfiddle | Charles-Jeremy Colnet |