
La solution la plus simple pour afficher une vidéo Youtube en responsive
{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.
- 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.
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.
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
upactionslist (1) readmore (1) csv2def (1) youtube (2) box (1) jcontent-info (1)