Com-es-fa‎ > ‎How-to-do‎ > ‎

Afegir àudio: Playlist

13 de març 2011, 8:00 publicada per Albert Profe   [ actualitzat el 18 de març 2011, 14:07 ]
Nivell de dificultat: alt

En aquesta tercera part el que farem és afegir un reproductor d'àudio i unes cançons amb un menú PLaylist des del propi web (o per defecte un altre web on siguem propietaris). Es a dir, el reproductor i les cançons s'allotjaran en el vostre web. 

Aquí teniu l'exemple (imatge):


Ho farem en 7 passos:

1.- En primer lloc, hem de descarregar el reproductor que volem. En el nostre cas, descarreguem des de la plana:


el reproductor DewPlayer, que és open source i fàcil instal·lar.


2.- A una plana tipus "Emmagatzematge de fitxers" del nostre Site pujarem el reproductor que volem, Dewplayer té diversos i escollim DewPlayer-Playlist.swf. Hem de carregar el fitxer .swf a una plana d'aquest tipus ja que funciona com un FTP. Per exemple:

https://sites.google.com/site/albertprofe/documents/musica


3.- També pugem les cançons que volem en la nostra llista del reproductor a la mateixa plana. Podem separar el reproductor i les cançons en carpetes per tindre un major ordre.


4.- Ara que ja tenim el reproductor -en format .swf- i les cançons -en format .mp3- a la nostra web ja podem incrustar el codi HTML corresponent on vulguem que aparegui el nostre reproductor.


5.- On posa la teva web has de escriure la direcció de la web de Google Sites on s'han pujat el reproductor i les cançons. Recordem que en el nostre exemple era:

sites.google.com/site/albertprofe/documents/musica


6.- On posa playlist s'ha de crear un fitxer de text -amb el bloc de notes per exemple- que el desarem amb format .xlm amb els noms de les cançons. El fitxer es pot dir playlist.xlm per no tindre problemes i el pugem a la web, al mateix lloc que les cançons.


7.- Substitueix 
canço1, 
canço2 i 
canço3 amb els noms de les teves cançons
 que tenen una extensió mp3.
CODI HTML

<object type="application/x-shockwave-flash" data="la teva web/dewplayer-playlist.swf" width="240" height="200">

<param name="wmode" value="transparent" />

<param name="movie" value="la teva web/dewplayer-playlist.swf" />

<param name="flashvars" value="xml=la teva web/playlist.xml&autoreplay=1&showtime=1&volume=60" />

</object>


CODI FITXER .XLM PER EL PLAYLIST

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
    <title>playlist</title>
    
    <trackList>
        
<track>
          <location>canço1.mp3</location>
 <title>nom-canço1</title>
        </track>
    
    
<track>
          <location>canço2.mp3</location>
 <title>nom-canço2</title>
        </track>
        <track>
          <location>canço3.mp3</location>
 <title>nom-canço3</title>
        </track>
    </trackList>
</playlist>
Aquí teniu l'exemple (encara s'ha de configurar el fitxer .xml):

Comments