Lecteur audio

Le petit lecteur audio écrit pour WordPress peut être intégré à une page html quelconque (en dehors de WordPress).

Trois choses à faire :
1. Dans l’en-tête du fichier HTML il faut placer ce script :

<script language= »javascript1.4″ type= »text/javascript » src= »http://sharafat.hussain.free.fr/audioplayer/audio-player.js »></script>

dans lequel il faut mettre à jour l’ URL :

src= »http://sharafat.hussain.free.fr/audioplayer/audio-player.js »>

2. Placer les fichiers audio-player.js et player.swf dans le dossier désigné par l’URL du script ci-dessus.

3. Le lecteur proprement dit est appelé avec ce morceau de code :

<object type= »application/x-shockwave-flash » data= »http://sharafat.hussain.free.fr/audioplayer/player.swf » width= »290″
height= »20″ id= »audioplayer1″>
<param name= »movie » value= »http://sharafat.hussain.free.fr/audioplayer/player.swf » />
<param name= »FlashVars » value= »playerID=1&autostart=no&loop=no&bg=0xE9E6DF&leftbg=0xEEEEEE&lefticon=0×666666
&rightbg=0xCCCCCC&rightbghover=0×999999&righticon=0×666666&righticonhover=0xFFFFFF
&text=0×666666&slider=0×666666&track=0xFFFFFF&border=0×666666&loader=0xCCCCCC
&soundFile=http://sharafat.hussain.free.fr/AIR_1985/01_Intro.mp3″ />
<param name= »quality » value= »high » />
<param name= »wmode » value= »transparent » />
</object>

dans lequel il faut mettre à jour les URL :

data= »http://sharafat.hussain.free.fr/audioplayer/player.swf »
[...]
value= »http://sharafat.hussain.free.fr/audioplayer/player.swf » />
[...]
soundFile=http://sharafat.hussain.free.fr/AIR_1985/01_Intro.mp3 » />

Les morceaux peuvent être enchaînés, il suffit de séparer les URL par une virgule SANS espace.
Exemple d’utilisation sur http://sharafat.hussain.free.fr/

——————————-
De kleine audioplayer staat in de map www.sitarfactory.be/wp-content/plugins/
en in www.sitarfactory.be/wp-content/plugins/audioplayer/
Hij bestaat eigenlijk maar uit een javascript en een stukje code.

  • audio-player.js is de naam van de javascript (kan je bekijken met een text editor; aan de inhoud kan je verder niets veranderen)
  • player.swf is de naam van de code (hier is niets te zien)

Om hem zeer gemakkelijk onder WordPress te gebruiken heeft hij nog een ander onderdeel:

  • audio-player.php

Hem vanuit de WordPress blog gebruiken is zeer gemakkelijk.
In het bericht plaats je gewoon dit:
[audio:KakoSurbahar.MP3]
Dat is alles. En geeft dit resultaat :       

Clip audio : Le lecteur Adobe Flash (version 9 ou plus) est nécessaire pour la lecture de ce clip audio. Téléchargez la dernière version ici. Vous devez aussi avoir JavaScript activé dans votre navigateur.

De opgeroepen mp3-files (in dit geval KakoSurbahar.MP3) moeten gewoon in de map www.sitarfactory.be/audio staan.
Dit kun je veranderen als admin, bij Options/Audio Player hier

Je kunt ook vreemd gaan door een « vreemd » URL aan te geven:
[audio:http://www.sitarfactory.be/sound/ShopDiscussion1.MP3]      

Clip audio : Le lecteur Adobe Flash (version 9 ou plus) est nécessaire pour la lecture de ce clip audio. Téléchargez la dernière version ici. Vous devez aussi avoir JavaScript activé dans votre navigateur.

Vanuit WordPress gezien liegt dit URL buiten de site, omdat voor WP http://www.sitarfactory.be de root is!

Of [audio:http://sharafat.hussain.free.fr/AIR_1985/01_Intro.mp3]     :  

Clip audio : Le lecteur Adobe Flash (version 9 ou plus) est nécessaire pour la lecture de ce clip audio. Téléchargez la dernière version ici. Vous devez aussi avoir JavaScript activé dans votre navigateur.

Let op, met de zeer grote files schijnt het niet zo goed te werken (opstarten duurt ontzettend lang).
Vermoedelijk moet je dan kleinere stukken achter elkaar plakken (zie uitleg helemaal aan het eind van deze pagina).


——————- Audio Player in een HTML-pagina gebruiken ————————-
[Let op, dit gedeelte heb ik nog niet zorgvuldig na gekeken om zeker te zijn dat de syntax klopt]

Om hem ergens andres te gebruiken, bv om hem in een html-pagina op te roepen, is het niet veel moeilijker.

Er wordt geen gebruik meer gemaakt van audio-player.php.
Alleen de javascript audio-player.js en het stukje code player.swf worden gebruikt.
Daarom heb ik de twee files nog een keer op een andere plek gezet:
Ze staan nu ook in http://www.sitarfactory.be/audioplayer/
Dit was eigenlijk niet nodig, ik had net zo goed de twee files in www.sitarfactory.be/wp-content/plugins/audioplayer/ kunnen gebruiken.

1. in de header van het HTML document moet de javascript opgeroepen worden:
Dus moet in je html-code, ergens tussen <header> (dat was dus het begin van de header) ….. en …. (het eind van de header) </header> de volgende regel staan :
<script language=”javascript1.4? type=”text/javascript” src=”http://www.sitarfactory.be/audioplayer/audio-player.js”> < /script>

Daarmee wordt de plaats van de audioplayer aangegeven. Waar die staat is niet belangrijk, als de link maar klopt.
Als je hem ergens anders plaats, moet de link aangepast worden:
<src=”http://sharafat.hussain.free.fr/audioplayer/audio-player.js”>

De player zelf roep je in de body van de html pagina met de volgende code op :

<object type=”application/x-shockwave-flash” data=”http://www.sitarfactory.be/audioplayer/player.swf” width=”290”
height=”20” id=”audioplayer1”?>
<param name=”movie” value=”http://www.sitarfactory.be/audioplayer/player.swf” />
<param name=”FlashVars” value=”playerID=1&autostart=no&loop=no&bg=0xE9E6DF&leftbg=0xEEEEEE&lefticon=0×666666
&rightbg=0xCCCCCC&rightbghover=0×999999&righticon=0×666666&righticonhover=0xFFFFFF
&text=0×666666&slider=0×666666&track=0xFFFFFF&border=0×666666&loader=0xCCCCCC
&soundFile=http://www.sitarfactory.be/sound/ANANTraffic.mp3” />
<param name=”quality” value=”high” />
<param name=”wmode” value=”transparent” />
</object>

Deze code staat dus ergens tussen <body>… en …</body> op de plek(ken) waar je wenst dat de player komt te staan.

Onze de link naar de player staat twee keer in deze code, en moet dus eventueel twee keeraangepast worden zodra je de player ergens anders plaatst:

data=”http://www.sitarfactory.be/audioplayer/player.swf”
[…]
value=”http://www.sitarfactory.be/audioplayer/player.swf” />[…]
Waarom die link twee keer in de code staat is me een raadsel. Het is niet logisch, maar ja…
Zolang de player daar blijft staan, hoef je deze links gelukkig niet aan te passen.

Nu nog een laatste kleine aanpassing. Die is wel belangrijk.
De link naar de MP3-file die je wilt afspelen moet naar het juiste document wijzen.
Bij voorbeeld :

&soundFile=http://www.sitarfactory.be/sound/ANANTraffic.mp3” />

of bij voorbeeld een sound file die ergens anders vandaan komt:
&soundFile=http://sharafat.hussain.free.fr/AIR_1985/01_Intro.mp3”/>

Let op, er is een aan het eind van deze link (maar niet aan het begin) en die wordt vaak overschreven of vergeten… en dan gaat het mis!

Je kunt meerdere stukken MP3 achter elkaar hangen, door de bijhorende links gewoon achter elkaar te plakken, met een comma daartussen.
Let op, wel een comma maar geen spatie.
Voorbeeld:
&soundFile=http://www.sitarfactory.be/sound/ANANTraffic.mp3,sharafat.hussain.free.fr/AIR_1985/01_Intro.mp3”

Een uitleg van de kleurparameters vindt je in deze illustratie :

en eventueel hier.