Je viens de voir que les codes fournis par YouTube et DailyMotion ont changés mais ils ne sont toujours pas valides XHTML !
Ils n'ont toujours pas compris que <embed> était INTERDIT en XHTML :-C
Mais ce n'est pas grave, on va le rendre valide tout cela...

Le squelette (modèle), le voici :


<object width="largeur" height="hauteur" type="application/x-shockwave-flash" data="URL">
<param name="movie" value="URL" />
<param name="wmode" value="transparent" />
...
<param name="nom" value="valeur" />
...
<p>Texte de remplacement devant apparaitre si flash désactivé ou plugin absent (penser aussi aux aveugles et au référencement par Google/Yahoo...)</p>
</object>

Vous pouvez l'utiliser dans votre code directement si vous l'intégrez entre des <p>...</p>. Personnellement, je préfère centrer les vidéos, j'inscrit donc ce code dans un <div style="text-align: center;">...</div>. Si vous êtes en Wiki sous DotClear, utilisez ///html devant et /// après le code.

  • Un exemple sur une vidéo YouTube (choppé sur le blog d'Arkane), le code fourni est :

<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/YO9JDgU3EUs">
</param>
<param name="wmode" value="transparent">
</param>
<embed src="http://www.youtube.com/v/YO9JDgU3EUs" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350">
</embed>
</object>

Je le transforme ainsi :


<div style="text-align: center;">
<object width="425" height="350" type="application/x-shockwave-flash" data="http://www.youtube.com/v/YO9JDgU3EUs">
<param name="movie" value="http://www.youtube.com/v/YO9JDgU3EUs" />
<param name="wmode" value="transparent" />
<p>Clip La ceinture d'Elodie FREGE (en flash)</p>
</object>
</div>

pour obtenir ceci :

Clip La ceinture d'Elodie FREGE (en flash)

  • J'ai été prendre un exemple au hasard sur DailyMotion, c'est exactement pareil (ou presque) :

<div>
<object width="425" height="335">
<param name="movie" value="http://www.dailymotion.com/swf/1a1Hb25UtqnjK3usd">
</param><param name="allowfullscreen" value="true">
</param>
<embed src="http://www.dailymotion.com/swf/1a1Hb25UtqnjK3usd" type="application/x-shockwave-flash" width="425" height="334" allowfullscreen="true">
</embed>
</object>
<br /><b>
<a href="http://www.dailymotion.com/video/xhu0l_a-chaque-seconde">à chaque seconde</a>
</b><br />
<i>envoy&eacute; par <a href="http://www.dailymotion.com/morphologique">morphologique</a></i>
</div>

devient avec moi :


<div style="text-align: center;">
<object width="425" height="335" type="application/x-shockwave-flash" data="http://www.dailymotion.com/swf/1a1Hb25UtqnjK3usd">
<param name="movie" value="http://www.dailymotion.com/swf/1a1Hb25UtqnjK3usd" />
<param name="wmode" value="transparent" />
<p>Vidéo A chaque seconde de Sinclair (en flash)</p>
</object>
<p><b><a href="http://www.dailymotion.com/video/xhu0l_a-chaque-seconde">à chaque seconde</a></b><br />
<i>envoy&eacute; par <a href="http://www.dailymotion.com/morphologique">morphologique</a></i></p>
</div>

pour obtenir ceci :

Clip La ceinture d'Elodie FREGE (en flash)

à chaque seconde
envoyé par morphologique

Faite surtout très attention de bien répéter l'URL aux deux endroits nécessaires, l'un sert à Firefox, l'autre à Internet Explorer. Pour les tailles, par contre, en grand maniaque, je n'utilise jamais les nombres donnés par DailyMotion ou YouTube, qui sont standardisés, je préfère rechercher les tailles des vidéos d'origines, il y a ainsi beaucoup moins d'effets de mozaïques.

Une question ? N'hésitez pas ! :ange:

C'était difficile ? Non ! Et voilà :hysterique: