Nos Partenaires

Auteur Sujet: [TUTO] Insérer une vidéo dans un post  (Lu 8749 fois)

01 novembre 2010 à 23:00:44
Lu 8749 fois

** Mathieu **


COMMENT INSÉRER UNE VIDÉO DANS UN POST

Actuellement sur le forum il est possible d'intégrer des vidéos aux posts.

Des vidéos Youtube par exemple, et en fait toutes sortes de vidéos au format flash video encoded donc Dailymotion, Google video, etc.

Et ce grâce à la balise bbcode flash


La balise flash s'obtient avec le premier bouton de la seconde ligne du menu édition des messages, juste avant le bouton image.


[flash=hauteur,largeur][/flash]
 



YouTube

Rendez vous sur la page de la vidéo que vous souhaitez intégrer à votre post.

En dessous de la vidéo, il y a généralement un champ (ou bouton) Intégrer ou Embed.



Ce champ contient un code d'appel pour la vidéo dont vous allez vous servir, donc copiez le texte :

Citer

<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/C3HFl9zxVzI?fs=1&amp;hl=fr_FR"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/C3HFl9zxVzI?fs=1&amp;hl=fr_FR" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
 

Dans ce texte, vous allez récupérer les trois données nécessaires à la balise flash :
 
  • Largeur de la vidéo : width en anglais,
  • Hauteur de la vidéo : height en anglais,
  • Source de la vidéo : value ou src.

ici : 480 385 http://www.youtube.com/v/C3HFl9zxVzI?fs=1&amp;hl=fr_FR

NB : ne récupérez jamais les guillemets encadrants

Ensuite vous n'avez plus qu'à reporter ces données dans la balise flash de votre post, ce qui donnera :


[flash=480,385]http://www.youtube.com/v/C3HFl9zxVzI?fs=1&amp;hl=fr_FR[/flash]
 


Résultat :

<a href="http://www.youtube.com/v/C3HFl9zxVzI?fs=1&amp;amp;hl=fr_FR" target=_blank class=new_win>http://www.youtube.com/v/C3HFl9zxVzI?fs=1&amp;amp;hl=fr_FR</a>


EDIT : Youtube a légèrement modifié son interface, maintenant il faut choisir Partager > Intégrer > Utiliser l'ancien code d'intégration

Y'a même moyen de caler la vidéo sur un passage précis — bien pratique quand on veut faire gagner du temps aux lecteurs...

En ajoutant &start=15 suivi du nombre de secondes depuis le début, ici 15 :


[flash=425,349]http://www.youtube.com/v/GnpWypc7B3A&start=15[/flash]
ça marche super bien, ici la vidéo de Kelly McCann commence bien à 0:15

<a href="http://www.youtube.com/v/GnpWypc7B3A&amp;start=15" target=_blank class=new_win>http://www.youtube.com/v/GnpWypc7B3A&amp;start=15</a>




Dailymotion

Rendez vous sur la page de la vidéo que vous souhaitez intégrer à votre post.

En dessous de la vidéo, il y a généralement un champ (ou bouton) Intégrer ou Embed.



Ce champ contient un code d'appel pour la vidéo dont vous allez vous servir, donc copiez le texte :

Citer

<object width="480" height="345"><param name="movie" value="http://www.dailymotion.com/swf/video/x6nzyh?additionalInfos=0"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed type="application/x-shockwave-flash" src="http://www.dailymotion.com/swf/video/x6nzyh?additionalInfos=0" width="480" height="345" allowfullscreen="true" allowscriptaccess="always"></embed></object>
Brutal Self-Defense: Jugular Attack
envoy&eacute; par BlackBeltMagazine. - Plus de vid&eacute;os campus.
 

Dans ce texte, vous allez récupérer les trois données nécessaires à la balise flash :

  • Largeur de la vidéo : width en anglais,
  • Hauteur de la vidéo : height en anglais,
  • Source de la vidéo : value ou src.

ici : 480 345 http://www.dailymotion.com/swf/video/x6nzyh?additionalInfos=0

NB : ne récupérez jamais les guillemets encadrants

Ensuite vous n'avez plus qu'à reporter ces données dans la balise flash de votre post, ce qui donnera :


[flash=480,345]http://www.dailymotion.com/swf/video/x6nzyh?additionalInfos=0[/flash]
 


Résultat :

<a href="http://www.dailymotion.com/swf/video/x6nzyh?additionalInfos=0" target=_blank class=new_win>http://www.dailymotion.com/swf/video/x6nzyh?additionalInfos=0</a>



Google Video

Rendez vous sur la page de la vidéo que vous souhaitez intégrer à votre post.

En dessous de la vidéo, il y a généralement un champ (ou bouton) Intégrer ou Embed.



Ce champ contient un code d'appel pour la vidéo dont vous allez vous servir, donc copiez le texte :

Citer

<embed id=VideoPlayback src=http://video.google.com/googleplayer.swf?docid=1223446885278994895&hl=fr&fs=true style=width:400px;height:326px allowFullScreen=true allowScriptAccess=always type=application/x-shockwave-flash> </embed>
 

Dans ce texte, vous allez récupérer les trois données nécessaires à la balise flash :

  • Largeur de la vidéo : width en anglais,
  • Hauteur de la vidéo : height en anglais,
  • Source de la vidéo : value ou src.

ici : 400 326 http://video.google.com/googleplayer.swf?docid=1223446885278994895&hl=fr&fs=true

NB : ne récupérez jamais les guillemets encadrants - heureusement il n'y en a pas chez Google vidéo  ;)

Ensuite vous n'avez plus qu'à reporter ces données dans la balise flash de votre post, ce qui donnera :


[flash=400,326]http://video.google.com/googleplayer.swf?docid=1223446885278994895&hl=fr&fs=true[/flash]
 


Résultat :

<a href="http://video.google.com/googleplayer.swf?docid=1223446885278994895&amp;hl=fr&amp;fs=true" target=_blank class=new_win>http://video.google.com/googleplayer.swf?docid=1223446885278994895&amp;hl=fr&amp;fs=true</a>



Recommandations

Avec la balise flash vous pouvez intégrer n'importe quel contenu vidéo au format flash.

Veillez à introduire votre vidéo de quelques explications - et éventuellement d'une rapide description. Pour rappel :

De nombreux messages comportent des liens vers des vidéos hébergées sur YouTube ou d'autres services semblables. Ces vidéos sont souvent pratiques pour illustrer une idée, et c'est bien comme ça. Par contre, ces vidéos ne se substituent pas au contenu du forum. Un lien seul ne constitue pas une base de discussion, ni une réponse à une question. Faire ça tue la lisibilité d'une conversation, sans parler de ceux, nombreux ici, qui ont des connections lentes et/ou payent au Ko reçu.

C'est pourquoi nous vous demandons dorénavant de ne plus poster de lien sans explications qui décrivent un minimum ce qu'on verrait dans la vidéo si on cliquait sur le lien et soulignent les détails importants. L'équipe de modération va progressivement durcir la ligne de conduite à ce sujet, et ça ira sous peu jusqu'à l'effacement pur et simple des messages de mecs qui auraient peur de se fouler une phalange en écrivant trois lignes avec leur lien youtube, quand on en aura marre d'éditer nous-mêmes ou de demander des détails.

Merci à tous pour vos efforts !

Veillez également à ne pas poster trop de vidéos dans un même message, car bien que le contenu soit hébergé sur un serveur tiers, le temps de chargement de la page peut considérablement s'allonger...
Donc il est préférable de se limiter à une vidéo significative, suivie au besoin de liens vers d'autres vidéos complémentaires.
« Modifié: 29 juin 2011 à 14:39:32 par Mathieu »

01 novembre 2010 à 23:12:11
Réponse #1

** Mathieu **


Il est possible d'utiliser la balise flash pour insérer des animations flash au format SWF.

Mais le navigateur charge l'animation et cela alourdit d'autant le poids de la page, donc pénalise tout ceux qui ont une connexion bas débit ou payent au Ko.

Donc je ne vous recommande pas d'utiliser la balise flash pour insérer des animations swf, préférez plutôt un simple lien vers le site hébergeant l'animation ou le fichier swf.

Concernant les vidéos hébergées sur les plateformes de contenu vidéo type Youtube et consorts, le problème est minime dans la mesure où le navigateur ne charge pas la vidéo mais simplement une image extrait ; il y a tout de même le chargement de données liées au lecteur flash mais ce n'est rien comparé au téléchargement de la vidéo.

EDIT:

Poids de la page sans les vidéos :



Poids de la page avec les vidéos :



Soit une majoration de 143 Ko pour 3 vidéos, ce qui correspond bien au poids des trois images extraites de chaque vidéo.
« Modifié: 01 novembre 2010 à 23:27:37 par Mathieu »

23 mars 2011 à 06:18:33
Réponse #2

run974


J'ai remarqué que le lien d'intégration tel qu'il est fourni dorénavant par Youtube ne fonctionne plus avec cette méthode.

Tout du moins, il faut cocher "Utiliser l'ancien code d'intégration" dans les options proposées pour que le lien SRC fonctionne. On obtient alors un lien finissant en "FR"(?) comme dans le tuto, et la tout marche .. !


;)

04 mai 2011 à 12:59:59
Réponse #3

Lolo94


Moi: Youtube. Tu peux tout à fait limiter l'accès d'une vidéo aux seules personnes ayant le lien.

Il faut s'inscrire pour avoir un compte et tout ça... par contre le téléchargement et la configuration sont sans soucis.

Le seul truc c'est d'avoir des vidéos assez petites et bien compressées dans un format compatible, pour que ça aille vite, mais en pratique un clip fait avec un compact numérique en basse résolution fait l'affaire.

La vraie difficulté c'est de faire une vidéo intéressante.  :lol:

29 juin 2011 à 14:40:16
Réponse #4

** Mathieu **


POST ÉDITÉ :

Youtube a légèrement modifié son interface, maintenant il faut choisir Partager > Intégrer > Utiliser l'ancien code d'intégration

Y'a même moyen de caler la vidéo sur un passage précis — bien pratique quand on veut faire gagner du temps aux lecteurs...

En ajoutant &start=15 suivi du nombre de secondes depuis le début, ici 15 :


[flash=425,349]http://www.youtube.com/v/GnpWypc7B3A&start=15[/flash]
ça marche super bien, ici la vidéo de Kelly McCann commence bien à 0:15

<a href="http://www.youtube.com/v/GnpWypc7B3A&amp;start=15" target=_blank class=new_win>http://www.youtube.com/v/GnpWypc7B3A&amp;start=15</a>

05 octobre 2012 à 20:08:41
Réponse #5

floproteus


Salut !

Avec la mise à jour de YT, je n'arrive plus à mettre les vidéo ! Quelqu'un pourrait m'aider svp ?
Je ne vois plus le code comme avant !

[EDIT] autant pour moi ! J'ai trouvé ! :-[
<<<  cliquez ici ;) !

 


Keep in mind

Bienveillance, n.f. : disposition affective d'une volonté qui vise le bien et le bonheur d'autrui. (Wikipedia).

« [...] ce qui devrait toujours nous éveiller quant à l'obligation de s'adresser à l'autre comme l'on voudrait que l'on s'adresse à nous :
avec bienveillance, curiosité et un appétit pour le dialogue et la réflexion que l'interlocuteur peut susciter. »


Soutenez le Forum

Les dons se font sur une base totalement libre. Les infos du forum sont, ont toujours été, et resteront toujours accessibles gratuitement.
Discussion relative au financement du forum ici.


Publicité

// // //