UP-LOMART - media-youtube ~ affiche des vidéos youtube

La solution la plus simple pour afficher une vidéo Youtube en responsive

🆙 media_youtube (youtube) : affiche une video Youtube qui s'inscrit au maxima dans son bloc parent

Cliquer pour lire la documentation

{up media-youtube=ID [|autoplay|play-on-visible|muted|loop]}
ID : il s'agit du code figurant à la fin de l'URL de la vidéo.

@author: LOMART/ modifié par Pascal @version: UP-0.9 @license: GNU/GPLv3 @tags: Media

media_youtube (youtube): code de la video (à la fin de l'url youtube)
ratio = 16/9: homothétie de la vidéo sous la forme 16/9 ou 1.77
width (l,largeur,w): largeur de la video en px ou %
autoplay: demarrage automatique
loop: boucle sur la video
muted: coupe le son
play-on-visible: démarre et arrête la video selon sa visibilité sur l'ecran

Style CSS

id: Identifiant
class: classe pour bloc externe
style: code css libre pour bloc externe

Divers

rgpd = 1: 0 pour ne pas appliquer la règle pour le RGPD

Version 1.9.5: marche/arret selon visibilité vidéo à l'écran (par Pascal)
Version 2.9: ajout option RGPD pour ne pas appliquer localement la règle générale
Version 3.0: ajout d'une option ratio qui permet d'ajuster le rapport largeur/hauteur de la vidéo pour éviter des marges noires.
Modification du code CSS pour le responsive qui utilise maintenant la propriété media-ratio. Cela permet une compatibilité avec des plugins RGPD comme Cookie CK.

Voir les nouveautés replier

En version minimale, il suffit d'indiquer le code figurant à la fin de l'URL de la vidéo.

{up youtube=r1X9QWpWu-I}

{up youtube=r1X9QWpWu-I | width=50% | style=border:red 2px solid | class=mcenter }

Il est possible d'indiquer la largeur par width. Mais il peut être judicieux d'utiliser les UP-CSS pour avoir les largeurs selon la taille de l'écran

{up youtube=r1X9QWpWu-I  | play-on-visible | style=border:green 2px solid | class=mcenter w6 ws12 }

version 1.9.5 Ajout de Pascal. L'option play-on-visible démarre la vidéo quand elle est entièrement affichée dans votre navigateur et l'arrête dès qu'elle est masquée.

La hauteur est gérée automatiquement pour que l'affichage de la vidéo soit responsive.
Inutile de spécifier la hauteur, elle sera ignorée.

Youtube insère des cookies sur le poste de l'internaute. Vous devez prévenir les utilisateurs et le gérer dans vos conditions d'utilisation.

Si vous utilisez TarteAuCitron, depuis la version 2.4, cette action va générer automatiquement le code attendu par ce script pour respecter les obligations du RGPD.Attention, l'option play-on-visible de fonctionne pas dans ce cas

Pour info, cette page utilise 7 action(s) :
upactionslist (1) readmore (1) csv2def (1) youtube (2) box (1) jcontent-info (1)