Page Comparison

Tool kit Tou.tv

Historique des modifications

...

le <head> du site (s’assurer d’avoir: <meta name="robots" content="sponsored" /> ),
un <header>
une mention "CONTENU PUBLICITAIRE"
une mention légale
un <footer>.

Code

Un kit, incluant un HTML de base, un CSS et les Fonts de Radio-Canada est construit pour les contenus commandités.

...

HTML : https://ici.tou.tv/kit-commanditaires/index.html
CSS : https://ici.tou.tv/kit-commanditaires/style/base.css
Font : https://ici.tou.tv/kit-commanditaires/fonts/

Notes :

Pour obtenir les fonts de Radio-Canada, il faudra contacter Laurence Bourque au laurence.bourque@radio-canada.ca .

Ce kit sera sporadiquement mis à jour.
Il est de la responsabilité du producteur de contenus de débuter les travaux avec la dernière mise à jour de ces documents.

La navigation simplifiée a été faite pour être incorporée sur les sites externes de Tou.tv..
Au clique, l'utilisateur est redirigé sur la page d'accueil de TouTv.

...

Mention "CONTENU PUBLICITAIRE"

Cette mention, et son modal, ne doivent pas être déplacée ou retirée.

Code Block

language	html

<div id="contenu-annonceur" class="banner">
   <span class="pleasenote-title">Contenu publicitaire</span>
   <div class="pleasenote-button">
      <button type="button" title="Plus d'informations sur le contenu annonceur">
         <svg
            aria-hidden="true"
            class="svg-icon icon-info_outlined"
            height="18"
            icon="info_outlined"
            width="18"
            >
            <use xlink:href="/kit-commanditaires/svg/toutv-icons-sprite.svg#info_outlined" />
         </svg>
         <svg
            aria-hidden="true"
            class="svg-icon icon-close_outlined"
            height="18"
            icon="close_outlined"
            width="18"
            >
            <use xlink:href="/kit-commanditaires/svg/toutv-icons-sprite.svg#close_outlined" />
         </svg>
      </button>
   </div>
   <div class="pleasenote-overlay"></div>
   <div class="pleasenote-container">
      <div class="pleasenote-inner">
         Ce contenu est payé par un annonceur. Il ne s'agit pas d'un contenu journalistique de Radio-Canada. 
         <a href="//solutionsmedia.cbcrc.ca/fr/page/contenu-publicitaire-transparence/" target="_blank" rel="noopener noreferrer">
            Consultez ce lien pour en savoir davantage&nbsp;
            <svg
               aria-hidden="true"
               class="svg-icon icon-link_external"
               height="14"
               icon="link_external"
               width="14"
               >
               <use xlink:href="/kit-commanditaires/svg/toutv-icons-sprite.svg#link_external" />
            </svg>
         </a>
      </div>
   </div>
</div>

Commentaires

Des commentaires ont été ajoutés dans le HTML pour indiquer à quels endroits il faut modifier le code pour inclure la mention "CONTENU PUBLICITAIRE".
Ces commentaires seront semblables à celui-ci:

...

Code Block
<!-- [Reste des fichiers ici] -->

Mention légale (obligatoire, à ajouter)

La mention légale ne fait pas partie de ce tool kit car doit être contextualisée à l'annonceur, mais doit OBLIGATOIREMENT être inclus au bas de la page de l'annonceur. :

...

Ce contenu est payé par [nom de l’annonceur]. Il ne s'agit pas d'un contenu de Radio-Canada. Consultez ce lien pour en savoir davantage [icône lien externe]

Le footer pour sa part est le même que le site principal.

...

Restrictions

Les contenus des annonceurs doivent être approuvés par la direction de TOU.TV.

...

Ces pages ne doivent pas ressembler à une page de type Émission de TOU.TV.

Exemple d'utilisation

...

Versions Compared

Old Version 11

New Version 12

Key