TV5MONDE Réalisation widgets pour les sites AeE REFERENCE :

Transcription

1 Guide d installation des widgets CLIENT : TV5MONDE PROJET : Réalisation widgets pour les sites AeE REFERENCE : Production/documentation/ DATE DE MISE A JOUR : 08/04/2014 ETAT : travail / terminé / validé / archivé REDACTEUR(S) Thierry Cherpitel (t.cherpitel@eclydre.fr) REVISION 0 OBJET DU DOCUMENT Guide d installation des widgets 7, rue Taylor Paris tel : fax :

2 1 08/04/14 2 Historique des versions Version Date Objet de la mise à jour 1 08/04/14 Création du document

3 1 08/04/14 3 Sommaire 1 Le widget «Apprendre le français avec TV5MONDE» Contenus du widget Apprendre Installation du widget Apprendre Taille du widget Apprendre Le Carrousel du widget Apprendre Le widget «Enseigner le français avec TV5MONDE» Contenu du widget Enseigner Installation du widget Enseigner Taille du widget Enseigner Le Carrousel du widget Enseigner... 7

4 1 08/04/ Le widget «Apprendre le français avec TV5MONDE» 1.1 Contenus du widget Apprendre Le bloc affiche un carrousel présentant 6 contenus : La première série publiée en «une» pour chaque niveau de l accueil du site (soit 4 séries), Un bloc d accès au TCF, Un bloc d accès au site PFCF. Chaque série d exercices est présentée par une vignette, le titre et les compétences de la série (ci-dessous à gauche). La vignette et le titre sont cliquables et renvoient vers la page correspondante sur le site apprendre.tv. Les accès aux sites du TCF et PFCF (ci-dessous à droite) sont présentés par un visuel et un titre invariables.

5 1 08/04/ Installation du widget Apprendre Le widget TV5MONDE Apprendre peut être appelé dans n'importe quelle page HTML via une i-frame. Pour appeler le widget TV5MONDE Apprendre dans un document HTML, insérer le code suivant : <iframe width="317" height="671" src=" 1.3 Taille du widget Apprendre Tailles par défaut Largeur : 317 px hauteur : 671 px Tailles recommandées Largeur minimum : 317 px Hauteur minimum : 671 px Largeur maximum : 350 px Hauteur maximum : 741 px Pour adapter la taille du widget à son contexte, remplacer les valeurs mentionnées en gras ci-dessous par la largeur (width) et la hauteur (height) souhaitées : <iframe width="317" height="671" src=" 1.4 Le Carrousel du widget Apprendre Par défaut, le carrousel ne défile pas automatiquement. Le défilement automatique du carrousel est paramétrable. À la suite de l'url du widget, passer les paramètres suivants précédés de «?» : 'scroll=auto' pour activer le défilement automatique du carrousel. Par défaut, l'intervalle de temps entre deux images est réglé à 5 secondes. 'timeout=8000' pour modifier la vitesse de défilement : le nombre renseigné après «timeout» est exprimé en milisecondes. Ainsi, pour paramétrer la vitesse de défilement à une image toutes les 8 secondes, il faudra ajouter 'timeout=8000' à la suite de l'url. Exemple: <iframe width="317" height="671" src=" frameborder="no" scrolling="no" border="no" allowtransparency="true"></iframe>

6 1 08/04/ Le widget «Enseigner le français avec TV5MONDE» 2.1 Contenu du widget Enseigner Le bloc affiche un carrousel présentant les 5 fiches pédagogiques publiées en «une» de l accueil du site, dans l ordre chronologique inversé. Ce tri est basé sur les dates de publication des blocs «Ressources accueil». Chaque fiche pédagogique est présentée par une vignette, le titre et le niveau de la ressource. La vignette et le titre sont cliquables et renvoient vers la page correspondante sur le site enseigner.tv. 2.2 Installation du widget Enseigner Le widget TV5MONDE Enseigner peut être appelé dans n'importe quelle page HTML via une i-frame. Pour appeler le widget TV5MONDE Apprendre dans un document HTML, insérer le code suivant : <iframe width="317" height="671" src="

7 1 08/04/ Taille du widget Enseigner Tailles par défaut Largeur : 317 px hauteur : 671 px Tailles recommandées Largeur minimum : 317 px Hauteur minimum : 671 px Largeur maximum : 350 px Hauteur maximum : 741 px Pour adapter la taille du widget à son contexte, remplacer les valeurs mentionnées en gras ci-dessous par la largeur (width) et la hauteur (height) souhaitées : <iframe width="317" height="671" src=" 2.4 Le Carrousel du widget Enseigner Par défaut, le carrousel ne défile pas automatiquement. Le défilement automatique du carrousel est paramétrable À la suite de l'url du widget (surlignée en gris ci-dessous), passer les paramètres suivants précédés de «?» : 'scroll=auto' pour activer le défilement automatique du carrousel. Par défaut, l'intervalle de temps entre deux images est réglé à 5 secondes. 'timeout=8000' pour modifier la vitesse de défilement : le nombre renseigné après «timeout» est exprimé en milisecondes. Ainsi, pour paramétrer la vitesse de défilement à une image toutes les 8 secondes, il faudra ajouter 'timeout=8000' à la suite de l'url. Exemple: <iframe width="317" height="671" src=" frameborder="no" scrolling="no" border="no" allowtransparency="true"></iframe>