Lecteur vidéoSi des données de type vidéo sont associées aux informations, il est possible de faire apparaître un lecteur vidéo qui permettra aux internautes de les visionner. Contrairement à la vignette et à l'illustration, ces données vidéo ne sont pas gérées en tant que telles (il est plus rare de rencontrer une vidéo que des images). Toutefois, elles peuvent être associées soit sous forme d'un fichier attaché, soit via un lien associé à l'information. Il est également possible, ce qui est vivement conseillé, de placer la vidéo sur la plate-forme YouTube et de la visionner à partir de votre page web (YouTube possède en effet des serveurs ultra-performants répartis un peu partout sur le globe et totalement dédiés à la diffusion de vidéos. Ces moyens techniques sont hors de portée de l'université). Pour exploiter ces données vidéo, il est nécessaire d'utiliser un élément <vidéo> dans l'élément <affichage> qui fera apparaître le lecteur vidéo à l'endroit précisé. Comment associer une donnée vidéo |
La première possibilité est de placer la donnée vidéo dans un fichier attaché lié à l'information. Seuls les fichiers mp4 et ogg sont supportés pour l'instant. Si la balise <vidéo/> est présente, ce fichier attaché sera soustrait de la liste des fichiers attachés et proposé à l'écoute via le lecteur vidéo. La deuxième possibilité (si aucun fichier attaché audio n'est trouvé), c'est d'utiliser le lien de l'information. Si celui-ci contient une URL qui pointe vers un document de type mp4 ou ogg et que la balise <vidéo/> est présente, alors le lecteur vidéo sera utilisé pour écouter ce document. Attention, dans ce cas, le document vidéo ne sera pas mis en cache et sera utilisé via l'URL en question (assurez-vous que ce document ne disparaisse pas). La troisième possibilité, la plus adéquate, est d'utiliser un lien égal à youtube:xxxx où xxxx est l'identificateur d'une vidéo que vous avez placé sur le site de YoutTube. Consultez les documents ci-contre pour savoir comment les fichiers attachés et les liens sont gérés dans les différentes sources. |
Pour plus d'information sur les données disponibles: |
Cet exemple utilise <vidéo/> sans attribut largeur. La taille par défaut (240 pixels) sera utilisée. |
Exemple <valves style="colorBar4" debug="oui"> <affichage> <titre/> <vidéo/> <contenu/> </affichage> <source-xml href="http://www.ulb.ac.be/cache/news-test1.xml" identificateurs="lune"/> </valves> loading...ajax1 |
Cet exemple utilise une largeur de 200 pixels. |
Exemple <valves style="colorBar4" debug="oui"> <affichage> <titre/> <vidéo largeur="200"/> <contenu/> <contenu/> </affichage> <source-xml href="http://www.ulb.ac.be/cache/news-test1.xml" identificateurs="lune"/> </valves> loading...ajax2 |
Position du lecteur vidéoPar défaut, la vidéo s'affichera à droite et le texte qui suit viendra se positionner à gauche de celle-ci. Vous pouvez changer cela grâce à un attribut position comme pour une image. |
Cet exemple aligne le lecteur à gauche. |
<vidéo largeur="240" position="gauche"/> loading...ajax3 |
Cet exemple aligne le lecteur au centre. |
<vidéo largeur="240" position="centre"/> loading...ajax4 |
Cet exemple aligne le lecteur à droite. |
<vidéo largeur="240" position="droite"/> loading...ajax5 |
Cet exemple aligne le lecteur à gauche et positionne le texte tout autour. |
<vidéo largeur="240" position="gauche-texte"/> loading...ajax6 |
Cet exemple aligne le lecteur à droite et positionne le texte tout autour. |
<vidéo largeur="240" position="droite-texte"/> loading...ajax7 |
Espacement autour du lecteur vidéoComme pour la vignette et l'illustration, il est possible de régler l'espacement entre le lecteur vidéo et le reste du texte, grâce aux attributs espace-haut, espace-bas, espace-gauche et espace-droite. |
Le même exemple que ci-dessus, mais avec un espacement de 20 pixels à gauche et en bas. |
<vidéo largeur="240" position="droite-texte" espace-bas="20" espace-gauche="20"/> loading...ajax8 |
Dans cet exemple, la vignette et le lecteur vidéo sont positionnés tous les deux à droite du texte. |
<valves style="colorBar4" debug="oui"> <affichage> <titre/> <vignette position="droite-texte"/> <vidéo largeur="240" position="droite-texte"/> <contenu/> </affichage> <source-xml href="http://www.ulb.ac.be/cache/news-test1.xml" identificateurs="lune"/> </valves> loading...ajax9 |
Supprimer l'image en cas de présence du lecteur vidéo |
Vous pouvez dans ce cas décider de supprimer l'image en ajoutant un attribut image="non" sur l'élément <vidéo/>. Dans ce cas, si un lecteur vidéo est présent, l'image sera supprimée. |
<valves style="colorBar4" debug="oui"> <affichage> <titre/> <vignette position="droite-texte"/> <vidéo largeur="240" position="droite-texte" image="non"/> <contenu/> </affichage> <source-xml href="http://www.ulb.ac.be/cache/news-test1.xml" identificateurs="lune"/> </valves> loading...ajax10 |