mettre une vidéo en ligne sur son site

Classé dans : liens utiles | 6 commentaire(s)

Plusieurs solutions pour afficher une vidéo sur son site directement en ligne.

Si le fichier est en flash, extension *.swf, quelques simples lignes de codes peuvent suffire:

<p style="text-align: center;"><object width="550" height="350" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0">
<param name="movie" value="images/MONFICHIER.swf" />
<param name="quality" value="best" />
<param name="menu" value="true" />
<param name="allowScriptAccess" value="always" /> <embed width="550" height="350" src="images/MONFICHIER.swf" quality="best" menu="true" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" allowscriptaccess="always"></embed> </object></p>

Exemple (ne pas cliquer sur la banière, le lien est en erreur !):

 

Il existe une seconde solution : convertir le fichier *.swf en *.flv. à laide du logiciel que l'on veut. Placer ensuite, par FTP le fichier dans un dossier de son site.

Se rendre ensuite sur ce site : Lecteur FLV qui va vous proposer plusieurs solutions tant au niveau des possibilités des lecteurs qu'aux différents réglages possibles ainsi qu'un autre lecteur ayant la possibilité de gérer plusieurs fichiers à la fois. Vous obtenez alors un code de ce genre :

<object type="application/x-shockwave-flash" data="http://flv-player.net/medias/player_flv_maxi.swf" width="642" height="100">
    <param name="movie" value="http://flv-player.net/medias/player_flv_maxi.swf" />
    <param name="allowFullScreen" value="true" />
    <param name="FlashVars" value="flv=http%3A//www.MONSITE.info/DOSSIER/FICHIER.flv&amp;title=navette aéroport&amp;width=642&amp;height=100" />
</object>

Exemple ici, avec ce même fichier, mais demandant, volontairement un déclenchement au clic, par exemple pour éviter le déclechement intempestif de fichiers trop "sonores":

Il existe aussi bien sur toujours la possibilité d'intégrer par copier/coller également des vidéos présentes sur youtub ou dailymotion, telles celles qui se trouvent sur le portfolio et que vous pouvez voir en cliquant sur ces mots.

Sympa, non ?

Commentaires

Le 10 novembre 2009 unesourisetmoi à dit :

à voir pour d'autres codes et d'autres format de vidéos:
http://www.commentcamarche.net/forum/affich-2150558-inserer-video-dans-un-site-web


.Alphaorionis, le 24 mar 2006 à 18:11:53

* +7
*
*
*
*
*

<embed> n'est plus valide en XHTML (la version actualisée du HTML), il faut donc le remplacer par <object> qui lui est valide.
Les attributs à insérer diffèrent selon les formats (et donc les plug-in à employer):

Pour une vidéo .mov (QuickTime):

<object classid=\"clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B\" codebase=\"http://www.apple.com/qtactivex/qtplugin.cab\" width=\"\" height=\"\">
<param name=\"src\" value=\"*.mov\" />
<param name=\"controller\" value=\"true\" />
<object type=\"video/quicktime\" data=\"/images/peint.mov\" width=\"\" height=\"\" class=\"mov\">
<param name=\"controller\" value=\"true\" />
</object>
</object>



Pour les .mpg .mpeg .wma:

<object type=\"application/x-mplayer2\" width=\"\" height=\"\">
<param name=\"autostart\" value=\"true\" />
<param name=\"showcontrols\" value=\"true\" />
<param name=\"filename\" value=\"*.mpg\" />
</object>



Pour les .rm (Real Media):

<object classid=\"clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA\" width=\"\" height=\"\">
<param name=\"autostart\" value=\"true\" />
<param name=\"shuffle\" value=\"0\" />
<param name=\"prefetch\" value=\"0\" />
<param name=\"nolabels\" value=\"0\" />
<param name=\"src\" value=\"*.rm\" />
<param name=\"controls\" value=\"ImageWindow\" />
<param name=\"console\" value=\"video1\" />
<param name=\"loop\" value=\"0\" />
<param name=\"numloop\" value=\"0\" />
<param name=\"center\" value=\"0\" />
<param name=\"maintainaspect\" value=\"0\" />
<!--[if !IE]> <-->
<object type=\"audio/x-pn-realaudio-plugin\" data=\"../Videos/Reaction_public.rm\" width=\"\" height=\"\">
<param name=\"autostart\" value=\"true\" /><param name=\"controls\" value=\"ImageWindow\" />
</object>
<!--> <! endif -->
</object>



Voilà! Et c'est valide en XHTML!

PS: tous les \" viennent d'un bug d'affichage de CCM, il faut mettre " à la place.

Le 07 novembre 2009 DON-ATELLO à dit :

Bonjour,
Voilà le code en exemple :
<div><object width="420" height="357">
<param name="movie" value="http://www.dailymotion.com/swf/k61OGyhTB4zKzsN3m9&amp;related=0" />
<param name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="always" /><embed width="420" height="357" src="http://www.dailymotion.com/swf/k61OGyhTB4zKzsN3m9&amp;related=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always"></embed></object><br />
<b><a href="http://www.dailymotion.com/video/x6yktd_mother-short-movie-2007_creation">Mother [short movie] 2007</a></b><br />
<i>envoy&eacute; par <a href="http://www.dailymotion.com/slycoart">slycoart</a></i></div>
voilà ma vidéo :
"http://www.dailymotion.com/video/xazekh_donatello-ici-cest-rap-realite_music"
Comment faire pour inclure ma vidéo dans le code que vous donnez ?

Le résultat et l'explication sont ici :
http://www.unesourisetmoi.info/portofolio/mettre-des-videos-sur-dailymotion-et-sur-votre-site.php
(avec le clip !)

Le 07 novembre 2009 DON-ATELLO à dit :

Bonjour,
Je suis venue sur ce site pour trouver ce que je cherche depuis pas mal de temps. Voilà mon site "http://www.avcvk.com/" et je voudrais y mettre mes vidéos qui sont sur "dailymotion" avec "Microsoft Office SharePoint Designer 2007" je ne sais pas où je dois mettre tous ses codes pour que cela marche. Pouvez-vous m'aidez. Essayer de voir comment faire grâce à se logiciel gratuit.

ben c'est fait ... mais votre site n'est pas un 'site' ais une vague page avec quelques liens ! Il faut revoir tout le codage ...

Le 24 octobre 2009 RAD ZONE à dit :

autre solution directe dans le body :

<div>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="myFlashContent">
<param name="movie" value="MONDOSSIER/MONFICHIER.swf">
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="MONDOSSIER/MONFICHIER.swf" width="800" height="600">
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a><p><a href="http://radservebeer.free.fr"><img src="http://radservebeer.free.fr/..." alt="radzone" /><br />insertion code generator by Rad Zone Webcreation
</a></p>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>

Le 05 octobre 2009 unesourisetmoi à dit :

aperçu du code à mettre pour la vidéo sur dailymotion:

<div><object width="420" height="357">
<param name="movie" value="http://www.dailymotion.com/swf/k61OGyhTB4zKzsN3m9&amp;related=0" />
<param name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="always" /><embed width="420" height="357" src="http://www.dailymotion.com/swf/k61OGyhTB4zKzsN3m9&amp;related=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always"></embed></object><br />
<b><a href="http://www.dailymotion.com/video/x6yktd_mother-short-movie-2007_creation">Mother [short movie] 2007</a></b><br />
<i>envoy&eacute; par <a href="http://www.dailymotion.com/slycoart">slycoart</a></i></div>

Le 05 octobre 2009 unesourisetmoi à dit :

aperçu du code à mettre pour l'exemple sur youtub:

<object width="500" height="405">
<param value="http://www.youtube.com/v/ueJcRmfweSM&amp;hl=fr&amp;fs=1&amp;rel=0&amp;color1=0x5d1719&amp;color2=0xcd311b&amp;border=1" name="movie" />
<param value="true" name="allowFullScreen" />
<param value="always" name="allowscriptaccess" /><embed width="500" height="405" allowfullscreen="true" allowscriptaccess="always" type="application/x-shockwave-flash" src="http://www.youtube.com/v/ueJcRmfweSM&amp;hl=fr&amp;fs=1&amp;rel=0&amp;color1=0x5d1719&amp;color2=0xcd311b&amp;border=1"></embed></object>

Fil des commentaires de cet article

Ecrire un commentaire




Quelle est la dernière lettre du mot hevg ? :   

bannière défilante pour un site web