FAT78 - Artisan numérique :-)
 

> Lab > Objet youtube

mercredi 3 mai 2017

Objet youtube

Il est parfois nécessaire d’insérer, dans une page, un média issu de YouTube. Une fois choisi sur YouTube l’objet souhaité, il faut en récupérer son code qui est fourni par YouTube dans les liens de partage. Il ne faut pas récupérer la totalité du lien (dans l’exemple, c’est https://youtu.be/Crz412sr4bo) mais juste le code du média choisi, que dans cet exemple est Crz412sr4bo

J’ai donc développé un modèle "youtube" qui permet d’insérer dans un article le média diffusé par YouTube, en ajoutant à l’appel du modèle "youtube" le paramètre comportant le code YouTube du média. Exemple : <youtube01|media=Crz412sr4bo>

"vidéo youtube"
(pas responsive - on peut écrire un long commentaire, il ne débordera pas de la largeur de l'image :-))

Alors, tant qu’à faire, j’ai complété ce modèle avec quelques paramètres permettant de contrôler la mise en page des médias "youtube". — identifiant numérique (01 à 99) obligatoire : permet d’insérer plusieurs médias "youtube" dans un même article
— |titre=titre du média, qui s’affiche en gras, centré, au-dessus du média (par défaut : rien)
— |legende=commentaire du média, qui s’affiche en italique au-dessous du média (par défaut : rien)
— |align=alignement du média left, center ou right (par défaut : center)
— |margin=marges en pixels à gauche et à droite du média (par défaut : 5)
— |width=largeur du média en pixels (par défaut : 480)

/ !\ N’écrire que les valeurs numériques sans le suffixe px

Pour info, voici l’écriture qui réalise l’affichage du média ci-contre :

<youtube01|media=Crz412sr4bo|align=right|margin=10|titre="vidéo youtube"|legende=(pas responsive - on peut écrire un long commentaire, il ne débordera pas de la largeur de l'image :-))>

Remarque "technique" : le mode d’inclusion délivré par les services tels que Youtube, GoogleMaps, Facebook, Twitter, etc., sont basés sur l’utilisation de la balise html "iframe" qui n’est pas du tout responsive. De ce fait, le média "youtube" inclus est à taille fixe : limitez-vous à un maximum de 800px de large pour qu’il soit visible sur les supports mobiles.


SPIP | | Plan du site | Suivre la vie du site RSS 2.0