Mardi 16 août 2005 2 16 /08 /2005 00:00
- Publié dans : Gadgets - Recommander
Encore une question traitée - souvent à la volée et de manière superficielle - dans le forum :
Comment insérer une musique dans son blog ?

Je vous conseille d'insérer les mp3 par la méthode dewplayer

Présentation

Il y a plusieurs façons de jouer de la musique sur Internet.
Les méthodes se différencient selon que l'on veut faire appel:
  • à l'application lecteur multimédia par défaut du visiteur (Windows Media Player, iTunes - QuickTime, RealMedia, WinAmp etc...) qui s'ouvre dans une nouvelle fenêtre.
  • au plugin multimédia du navigateur qui affiche ou non un panneau de contrôle dans la page web.
Mais la même méthode peut ne pas fonctionner selon :
  • le type de fichier musical que l'on veut jouer (MP3, AIF, MOV, RAM, etc..).
    Je vous conseille de définir le type de fichier dans le code que vous insérerez (voir les types MIME ci-dessous)
  • le navigateur du visiteur
  • le lecteur multimédia (et le système d'exploitation) du visiteur

Les méthodes

Dans chacune des méthodes ci-dessous, vous devez insérer le code HTML (en mode HTML et non Design) dans votre article, votre entête, votre pied de page ou un module Texte libre.

Le lien direct
La méthode IMG
La méthode OBJECT

Le lien direct

Il vous suffit d'insérer un lien vers votre fichier musical, par exemple:

<a href="http://francisek.gplm.free.fr/obzic/Mozart-la-flute-enchantee.mp3">La flûte enchantée</a>
Résultat:
La flûte enchantée

La musique ne démarre pas automatiquement, elle est d'abord intégralement téléchargée.


La méthode IMG

Cette méthode ne permet pas d'afficher de panneau de contrôle et fonctionne de manière aléatoire selon les navigateurs.
Le code HTML pour cette méthode est :
<IMG DYNSRC="http://urldemonfichier.fr/Mozart-la-flute-enchantee.mp3" border="0"/>
Autre inconvénient, il faut changer le style CSS des images afin de leur attribuer une bordure.


 

La méthode OBJECT

La méthode OBJECT est plus compliquée mais beaucoup plus intéressante que les précédentes car plus compatible. Elle permettra presque à coup sûr à vos visiteurs de profiter de votre musique.

La méthode OBJECT définit le lecteur (WMP, iTunes, RealPlayer) qui sera utilisé par votre visiteur. Je vous déconseille d'utiliser la version Windows Media Player car le plugin n'est pas disponible sur tous les systèmes d'exploitation et le panneau de contrôle ne s'adapte pas à la taille que vous définissez. Vous préférerez donc l'usage de QuickTime, beaucoup plus intéressant à mon sens.
Voici donc le code à insérer :

<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="160" HEIGHT="16" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM
name="SRC" VALUE="http://francisek.gplm.free.fr/obzic/playlist.m3u">
<PARAM
name="AUTOPLAY" VALUE="false">
<PARAM
name="LOOP" VALUE="false">
<PARAM
name="CONTROLLER" VALUE="true">
<EMBED
type="audio/x-mpegurl" src="http://francisek.gplm.free.fr/obzic/playlist.m3u" autoplay="false" width="160px" height="16px" loop="false" controller="true" PLUGINSPAGE="http://www.apple.com/quicktime/download/">
</EMBED>
</OBJECT>

Et le résultat:


Notez que la balise OBJECT inclut une balise EMBED pour assurer la compatibilité entre navigateurs.
Il faut donc définir deux fois les paramètres du lecteur. Les paramètres sont passés à la balise OBJECT via des balises <PARAM name="" value=""> et à la balise EMBED par des paires nom="valeur"

 

Ces paramètres sont les suivants :

Name Value
SRC URL du fichier ou de la playlist à lire.
AUTOPLAY
  • true : lecture automatique
  • false : lecture lancée par le visiteur
CONTROLLER
  • true : affiche le panneau de contrôle
  • false : n'affiche pas de panneau
TYPE

(dans EMBED) Type MIME du fichier à lire. Par exemple:

  • mp3 => audio/mpeg
  • m3u => audio/x-mpegurl
  • au => audio/basic
  • aiff => audio/aiff

L'avantage est qu'on peut aussi insérer des vidéos par ce biais.

  Voir tous les paramètres (en anglais)

 

Construire une Playlist (pour MP3)

Il y a de nombreux avantages à ne pas mettre un fichier MP3 directement en paramètre SRC mais plutôt un fichier de playlist (m3u):

  • lecture de plusieurs morceaux à la suite
  • lecture en streaming : la lecture commence sans que le fichier ne soit complètement chargé.
  • modifications faciles : pour ajouter des titres, il suffit d'éditer le fichier M3U

Je vous conseille donc d'utiliser une playlist même si vous n'avez qu'un fichier à lire !!

Le fichier de playlist est un simple fichier texte qui contient l'URL des fichiers MP3 à lire placés. Voici un exemple de fichier M3U :

Mozart-la-flute-enchantee.mp3
http://www.monsite.com/Beethoven-9eme.mp3
classique/dvorak-nouveau-monde.mp3

Le premier morceau est dans le même dossier que la playlist, le second sur un autre site et le troisième dans un sous-dossier classique.
 

Ecrire un commentaire - Voir les 74 commentaires
Retour à l'accueil

Rechercher

Twitter

Créer un blog gratuit sur OverBlog - Contact - C.G.U. - Rémunération en droits d'auteur - Signaler un abus - Articles les plus commentés