HTML - Lecteur vidéo en flash

Auteur : 3L!X | Créé le : 28/12/2005 à 19H00

Nous allons voir comment insérer un lecteur vidéo sur votre site (format .flv).
Ce lecteur est en flash, de façon à être compatible avec tous navigateurs, et de ne pas à avoir à charger de plugin supplémentaire.

Le lecteur peut changer de couleurs grâce à des paramètres optionnels (voir ci-dessous).

Encodage d'un fichier source

Tout d'abord il faut encoder votre vidéo (Avi, Mpeg, Mov, Wmv) en .flv (Flash Video).
Pour cela il existe un logiciel gratuit : Riva FLV Encoder 2.0.

Une fois le logiciel installé et lancé, il vous faudra paramétrer les différentes options, à savoir :

1. La vidéo de départ (Input)
2. La vidéo de sortie au format FLV (Output)
3. La résolution de la vidéo (Movie Size)
4. Le framerate (Image/seconde)
5. Le bitrate vidéo (Kbit/seconde)
6. Le bitrate audio (Kbit/seconde)

Une capture de mes paramètres au cas où (cliquez sur l'image pour l'agrandir).

Mise en place du lecteur

Une fois votre fichier .flv créé, vous pouvez à présent mettre en place le lecteur vidéo dans votre page web.
Téléchargez le fichier flvplayer.rar, et décompressez le pour récupérer les fichiers flvplayer.swf et config_flvplayer.txt.

Copiez ces fichiers et votre vidéo .flv à la racine de votre site ou dans un répertoire de votre choix.

Puis recopiez ce code sur votre page web, en modifiant les infos surlignées suivant votre configuration et emplacement :

<object type="application/x-shockwave-flash" {noir}data="/mon_repertoire/flvplayer.swf" width="240" height="180"{/noir}>
  <param name="movie" {noir}value="/mon_repertoire/flvplayer.swf"{/noir} />
  <param name="flashvars" {noir}value="config=/mon_repertoire/config_flvplayer.txt"{/noir} />
  <param name="wmode" value="transparent" />
  <param name="menu" value="false" />
</object>

Notre fichier config_flvplayer.txt (Voir "Paramètres du Jukebox" ci-dessous):

{noir}flv=/mon_repertoire/blaupunkt.flv
title=Blaupunkt
width=240
height=180{/noir}
margin=1
showstop=1
showvolume=1
autoload=1

Paramètres du Lecteur

Voici les différents paramètres optionnels pour ce lecteur, à ajouter dans votre fichier "config_flvplayer.txt" :

• "flv=" Indique l'adresse relative ou absolue du fichier flv.
• "width=" Largeur en pixel du film.
• "height=" Hauteur en pixel du film.
• "buffer=" Le nombre de secondes pour la mémoire tampon (5 par défaut).
• "buffermessage=" Le message de la mémoire tampon.
• "buffercolor=" La couleur du texte du message tampon.
• "bufferbgcolor=" La couleur de fond du message tampon.
• "buffershowbg=0" Pour ne pas afficher le fond du message tampon.
• "title=" Le titre affiché avant le chargement de la vidéo.
• "titlesize=" La taille de la police du titre (20 par défaut).
• "titlecolor=" La couleur du titre (ffffff par défaut).
• "margin=" La marge de la vidéo par rapport au Flash (4 par défaut).
• "autoplay=1" Pour lire automatiquement.
• "autoload=1" Pour lancer le chargement.
• "showstop=1" Pour afficher le bouton STOP.
• "showvolume=1" Pour afficher le bouton VOLUME.
• "showtime=" (1) Pour afficher le temps, (2) pour afficher le temps restant.
• "showplayer=" Affichage de la barre des boutons : autohide, always ou never.
• "showloading=" Affichage du chargement : autohide, always ou never.
• "loop=1" Pour lire en boucle.
• "startimage=" L'URL du fichier JPEG (non progressif) à afficher avant le chargement de la vidéo.
• "playercolor=" La couleur de fond du lecteur (pas du flash).
• "loadingcolor=" La couleur de la barre de chargement.
• "bgcolor=" La couleur de fond.
• "bgcolor1=" La première couleur du dégradé du fond.
• "bgcolor2=" La seconde couleur du dégradé du fond.
• "buttoncolor=" La couleur des boutons.
• "buttonovercolor=" La couleur des boutons au survol.
• "slidercolor1=" La première couleur du dégradé de la barre.
• "slidercolor2=" La seconde couleur du dégradé de la barre.
• "sliderovercolor=" La couleur de la barre au survol.
• "onclick=" L'URL de la destination au click sur la vidéo. Par défaut à playpause qui signifie que la vidéo fait play ou pause au click. Pour ne rien faire, il faut mettre none.
• "onclicktarget=" La cible de l'URL au click sur la vidéo. Par défaut à _self. Pour ouvrir une nouvelle fenêtre, mettez _blank.
• "playertimeout=" Le délai en milliseconde avant que la barre du lecteur se cache (1500 par défaut).
• "videobgcolor=" La couleur du fond de la vidéo quand il n'y a pas de vidéo.
• "volume=" Le volume initial, entre 0 et 200 (100 par défaut).
• "showfullscreen=1" Pour afficher le bouton pour le plein écran (nécessite Flash Player 9.0.16.60 ou supérieur).
• "showswitchsubtitles=1" Pour afficher le bouton qui affiche/cache les sous-titres.
• "loadonstop=0" Pour arrêter le chargement de la vidéo au STOP.
• "phpstream=1" Pour utiliser un streaming PHP.
• "ondoubleclick=" Action sur le double click : none, fullscreen, playpause, ou l'url à ouvrir.
• "ondoubleclicktarget=" La cible de l'URL au double click sur la vidéo. Par défaut à _self. Pour ouvrir une nouvelle fenêtre, mettez _blank.
• "showmouse=" Affichage de la souris : autohide, always ou never.

[9] commentaires - Voir/Editer

---

Commentaires

9 commentaires pour "HTML - Lecteur vidéo en flash"

Posté le 26/02/2008 à 17h11, par pimoos

Je ne comprends pas comment fonctionne le fullscreen, si quelqu'un pouvait m'aider s'il vous plait

Posté le 15/05/2008 à 16h31, par trekoy

ou apparait l'adresse du fichier flv a lire?

Posté le 15/05/2008 à 17h22, par 3L!X

Dans le fichier config_flvplayer.txt.

Posté le 18/05/2008 à 21h19, par grolix

pour le fullscreen:
ajoute "showfullscreen=1" au fichier txt
et ajoute "<param name="allowfullscreen" value="true" />" sur ta page web.
j'ai fais ca et ca fonctionne.

Posté le 21/05/2008 à 08h18, par pv

je ne comprends pas pourquoi cela ne marche pas pour moi, l'écran s'affiche toujours vide. Quelqu'un a eu le même soucis et pourrais m'aider?

Posté le 31/10/2008 à 14h16, par guillauebe

salut!
ce lecteur a l'air d'etre pas mal du tout simple et facile a placer..
apres coté fonctionnement.. blaukpunt c'est bien mais..

bon mon interrogation vient du fait qu'apres avoir modifié ce que je voulais (nom de la video chemin d'acces titre etc cela m'affiche toujours blaukpunt??? alors je ne sais pas si vous avez une suggestion parceque je crois avoir utilisé tout ce que j'ai à ma disposition.

En tout cas merci pour ce lecteur qui s'il focntionne servira grandement

Posté le 31/10/2008 à 19h14, par 3L!X

Essayez de vider le cache de votre navigateur.

Posté le 18/02/2009 à 19h55, par Frank77

J'ai un problème avec le plein écran. Ça ne marche pas bien dans Firefox et correctement dans IE7. je ne suis pas capable une fois le plein écran activé de le fermer et de l'ouvrir à nouveau. Donc je peux l'ouvrir une seule fois. Une réponse?

Posté le 22/10/2009 à 19h45, par koladonarmel

s'il vous plait pouviez vous detailler l'installation et la configuration ,voire meme un exemple de parametrage dans un site

Poster un commentaire

Pour poster un commentaire vous devez être membre
Connexion | Inscription