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/I05MIoZRCYY) mais juste le code du média choisi, que dans cet exemple est I05MIoZRCYY

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.

youtube.html.zip

Exemple : <youtube01|media=I05MIoZRCYY>

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
— |media=code YouTube de la vidéo (obligatoire)
— |layout=v pour une vidéo verticale (par défaut ne rien indiquer pour une vidéo horizontale)
— |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 vw (1vw=1% de la largeur de la fenêtre) à gauche et à droite du média (par défaut : 5 - ne pas ajouter "vw")
— |width=largeur du média en vw (par défaut : 90 - ne pas ajouter "vw") - / !\ width+2*margin doit faire 100 !
— |maxwidth=largeur maxi de la vidéo en px (par défaut : 1200 - ne pas ajouter "px")
— |minwidth=largeur mini de la vidéo en px (par défaut : 240 - ne pas ajouter "px")
— |bas=espacement en em sous la vidéo pour éviter que la légende chevauche le texte (par défaut : 3 - ne pas ajouter "em")

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

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

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