Oizoo Oizoo
Oizoo
communication numérique

Insérer un son dans un article

vendredi 10 septembre 2010

Voici quelques techniques pour insérer un son dans un article à partir d’un fichier mp3.
Envoyer à un ami
Version imprimable de cet article

Tout d’abord il faut charger le son sur le site, ce qu’on peut faire très simplement dans SPIP avec la fonction « Ajouter un document ».

Si le fichier est gros, ça prend longtemps, c’est normal, soyez patient.

Ensuite repérez où est stocké le son pour l’insérer dans votre article.

Pour cet exemple j’ai chargé le fichier « pas-sommeil.mp3 », un fichier de 4,6Mo qui est désormais à l’adresse suivante :

  • en adresse absolue : http://www.oizoo.com/IMG/mp3/pas-sommeil.mp3
  • en adresse relative : /IMG/mp3/pas-sommeil.mp3

à partir de là nous pouvons insérer le fichier son dans un article de plusieurs manières.

En voici trois exemple :

1) L’insertion d’un document à la méthode spip

J’insère la balise du document telle que proposée par spip comme ceci : <doc1448>

2) L’insertion d’un simple lien

J’insère un lien avec les balises simplifiées de spip comme ceci :

Pour écouter l’histoire de l’enfant qui n’avait pas sommeil, cliquez sur [Ce lien->/IMG/mp3/pas-sommeil.mp3]

Ces deux méthodes sont simples à mettre en œuvre et permettent d’enregistrer les fichiers sur le disque dur, puis de l’écouter sur son ordinateur ou dans un baladeur numérique.

Mais le résultat n’est pas forcément très esthétique, c’est pourquoi je recommande une troisième méthode : l’insertion d’un son en streaming à l’aide de DewPlayer.

3) Insertion d’un player dans une page

Pour intégrer véritablement le son dans un page web, vous pouvez le proposer en streaming à l’aide d’un player comme dewplayer

Cette méthode demande l’ajout d’un fichier à la racine de votre site,à prendre ici : Dewplayer .

Et l’insertion du code suivant dans votre article (remplacer l’url par celle de votre fichier mp3) :

<object type="application/x-shockwave-flash" data="dewplayer.swf" width="200" height="20" id="dewplayer" name="dewplayer"><param name="movie" value="dewplayer.swf" /><param name="flashvars" value="mp3=/IMG/mp3/pas-sommeil.mp3" /><param name="wmode" value="transparent" /></object>

Ce qui donne le résultat suivant :


A noter que, outre la meilleure intégration graphique dans la page, le streaming bloque la possibilité de charger le fichier son sur son disque.

Selon que vous souhaitez autoriser ou interdire le téléchargement de votre fichier son, il vous appartient donc de proposer l’une et/ou l’autre de ces méthodes.

Top
Crédits | Nous contacter
Plan du site | Revue de Web | Site réalisé par Oizoo avec SPIP | SPIP