NPDS : Gestion de contenu et de communauté
Content & Community Management System (CCMS) robuste, sécurisé, complet, performant, parlant vraiment français, libre (Open-Source) et gratuit.
14 visiteur(s) et 0 membre(s) en ligne.
Autres infos
Activité du Site
Pages vues depuis 25/05/2001 : 106 519 233
- Nb. de membres 8 692
- Nb. d'articles 1 695
- Nb. de forums 26
- Nb. de sujets 8
- Nb. de critiques 92
Index du forum »» Version future »» Youtube Video responsive & Tarteaucitron
Nouveau sujet
Youtube Video responsive & Tarteaucitron#26811Répondre
4Contributeur(s)
3 Modérateur(s)
developpeur
Idéalement il faudrait ajouter dans l'!iframe! les 2 styles ci-dessous
Cela permet d'améliorer la "responsivité" des videos youtube (et on peut faire la même addition pour vimeo et dialymotion)
A+
<!iframe! class="!embed!-responsive-item" style="aspect-ration:16/9; max-width:100%;"
Cela permet d'améliorer la "responsivité" des videos youtube (et on peut faire la même addition pour vimeo et dialymotion)
A+
developpeur
Ya aussi le code du plugin "media" de TinyMce qui n'est pas top
Avec une version non minifiée / la modif semble fonctionner ègalement
A suivre donc
Avec une version non minifiée / la modif semble fonctionner ègalement
A suivre donc
Message édité par : developpeur / 22-09-2022 14:47
colonelwog
merci dev pour ce petit bout de code dés que je me remets à codé je l'utiliserai pour mon module de galerie vidéo ... Bien sur pour la mise à jour du module pour la dernière version de NPDS ^^
Pour info il est en teste depuis pas mal de temps sur mon site les années 80:
http://www.lesannees80.free.fr/
Pour info il est en teste depuis pas mal de temps sur mon site les années 80:
http://www.lesannees80.free.fr/
jpb
pour une 16.4 normalement (bs 5.xx)
class="ratio ratio-16x9" (ou autre ratio voir doc)
dans le div parent suffit ...
https://getbootstrap.com/docs/5.2/helpers/ratio/
class="ratio ratio-16x9" (ou autre ratio voir doc)
dans le div parent suffit ...
https://getbootstrap.com/docs/5.2/helpers/ratio/
jpb
? dans quel cas ?
https://labo.infocapagde.com/minisite.php?op=jpb&startpage=2
est ce quand la vidéo à une toute petite résolution ?????
https://labo.infocapagde.com/minisite.php?op=jpb&startpage=2
est ce quand la vidéo à une toute petite résolution ?????
Message édité par : jpb / 23-09-2022 21:21
developpeur
Dans le cas que tu indiques, la taille du player est "null" ...
par contre, si tu fixe une taille (ce qui est bien pour éviter que la video soit la seule chose affichée dans la zone) cela ne fonctionne plus ... sauf avec aspect-ratio
par contre, si tu fixe une taille (ce qui est bien pour éviter que la video soit la seule chose affichée dans la zone) cela ne fonctionne plus ... sauf avec aspect-ratio
developpeur
regarde sur le site mbf / l'article avec la video - sans aspect-ration la video n'est pas responsive
jpb
https://labo.infocapagde.com/index.php?op=index.php
regarde article publié juste en utilisant le meta yt-video() (et le code source généré...) par le métamot
pour revenir à ça comprends toujours pas ...
"....si tu fixe une taille (ce qui est bien pour éviter que la video soit la seule chose affichée dans la zone)..."
<== si tu fixes une taille c'est l'inverse de la responsivité ... ce sont aux éléments contenant qu'il faut attribuer des comportements de tailles et de responsivité...
par exemple (moitié pour la vidéo la moitié pour le text sur la meme ligne sauf sur les petits medias)....
div class row
div class col-sm-6 le metamot /div
div class col-sm-6 mon text /div
/div
autrement dit les contenus suivent la responsivité des contenant .....
ou alors je comprends pas ...
sur mb-f peut etre qu'on est pas tout à fait à jour dans les meta de la bd ???? car tu ne devrait pas avoir les classes !embed!-responsive ..... et donc pour résumer le métamot fait son boulot et apporte la classe ratio qui est utilisé comme marqueur par BS pour réécrire le html du contenair de la vidéo (...les dimensions null...)
- pour le pluggin media de tiny je n'ai pas regardé ....
regarde article publié juste en utilisant le meta yt-video() (et le code source généré...) par le métamot
Message édité par : jpb / 26-09-2022 18:37
pour revenir à ça comprends toujours pas ...
"....si tu fixe une taille (ce qui est bien pour éviter que la video soit la seule chose affichée dans la zone)..."
<== si tu fixes une taille c'est l'inverse de la responsivité ... ce sont aux éléments contenant qu'il faut attribuer des comportements de tailles et de responsivité...
par exemple (moitié pour la vidéo la moitié pour le text sur la meme ligne sauf sur les petits medias)....
div class row
div class col-sm-6 le metamot /div
div class col-sm-6 mon text /div
/div
autrement dit les contenus suivent la responsivité des contenant .....
ou alors je comprends pas ...
Message édité par : jpb / 26-09-2022 18:57
sur mb-f peut etre qu'on est pas tout à fait à jour dans les meta de la bd ???? car tu ne devrait pas avoir les classes !embed!-responsive ..... et donc pour résumer le métamot fait son boulot et apporte la classe ratio qui est utilisé comme marqueur par BS pour réécrire le html du contenair de la vidéo (...les dimensions null...)
- pour le pluggin media de tiny je n'ai pas regardé ....
Message édité par : jpb / 26-09-2022 18:58
Message édité par : jpb / 27-09-2022 11:10
developpeur
je ne comprends plus ... ou est le soucis et quelle est la bonne correction
Avec la version actuelle de NPDS sur mb-f.fr / Si j'enlève apsect-ratio / pas de responsivité
8-) 8-)
Avec la version actuelle de NPDS sur mb-f.fr / Si j'enlève apsect-ratio / pas de responsivité
8-) 8-)
jpb
:-o :#
en regardant le code source de l'article on voit (la classe !!embed!!-responsive ..... elle n'existe pas/plus dans ta version et c'est elle qui dans les css antérieur de bootstrap assurait la responsivité) ....
donc
- si tu as écris ou écris toi meme le html
class="ratio ratio-16x9" (ou autre ratio voir doc) dans le div parent suffit ...
https://getbootstrap.com/docs/5.2/helpers/ratio/
- si tu utilise un outil de npds (metamot) tu n'as rien à corriger juste à utiliser le métamot (SI le métamot est à jour dans ta base de donnée !) (conforme à ce que l'on a dans le labo et la version actuelle)
en regardant le code source de l'article on voit (la classe !!embed!!-responsive ..... elle n'existe pas/plus dans ta version et c'est elle qui dans les css antérieur de bootstrap assurait la responsivité) ....
donc
- si tu as écris ou écris toi meme le html
class="ratio ratio-16x9" (ou autre ratio voir doc) dans le div parent suffit ...
https://getbootstrap.com/docs/5.2/helpers/ratio/
- si tu utilise un outil de npds (metamot) tu n'as rien à corriger juste à utiliser le métamot (SI le métamot est à jour dans ta base de donnée !) (conforme à ce que l'on a dans le labo et la version actuelle)