====== Tuto d'installation du player mp3 multi de Neolao ======



Ce tutoriel vise à guider l'installation et la configuration du [[http://resources.neolao.com/flash/components/player_mp3/templates/multi|lecteur mp3 multipistes

de Neolao]] dans un blog Dotclear. Il est cependant tout à fait utilisable dans n'importe quel site web.



  * démonstration chez [[http://resources.neolao.com/download/flash/components/player_mp3_multi.html|Neolao]]

  *** Exemple chez moi avec** [[http://www.kozlika.org/kozeries/index.php/encore/Radio-Kastafiore|Radio Kastafiore]]



===== Mise en place =====



==== Préparation des fichiers ====



Sur votre disque dur, créez un répertoire nommé **ma-radio**. Placez-y :



  * le fichier **[[http://resources.neolao.com/_media/flash/components/player_mp3_multi.swf|player_mp3_multi.swf]]**  ((Pour télécharger ce fichier, faire un clic droit sur le lien (ou un ctrl_clic sous Macintosh), puis Enregistrer la cible du lien sous...))

  * un répertoire **sons** dans lequel vous placerez vos mp3 //([[:geekeries:kastafiore:details|conseils]])//

  * un fichier nommé **config_multi.txt** ou **configxml_multi.xml** //([[:geekeries:kastafiore:details|explications et modèles]])//

  * un fichier nommé **playlist.txt** //([[:geekeries:kastafiore:details|explications et modèle]])//











==== Envoi des fichiers ====



Envoyez le répertoire **ma-radio** et son contenu dans votre espace web. //Si vous utilisez un blog Dotclear, le plus simple est de l'envoyer dans le répertoire **public**, cela vous permettra d'ajouter ou supprimer des morceaux directement par le gestionnaire de médias.//



==== Affichage dans le blog ====



=== Dans un widget ===



Ajoutez un widget text dans le bandeau de votre choix et placez-y le code suivant :



<code html>

<div>

  <object type="application/x-shockwave-flash" data="http://www.chemin/vers/repertoire/ma-radio/player_mp3_multi.swf" height="220" width="180">

  <param name="movie" value="http://www.chemin/vers/repertoire/ma-radio/player_mp3_multi.swf" />

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

  <param name="FlashVars" value="config=http://www.chemin/vers/repertoire/ma-radio/config_multi.txt" />

  <p>Lecteur mp3 en flash, merci <a href="http://resources.neolao.com/flash/components/player_mp3/templates/multi">Neolao</a></p>

  </object>

</div>

</code>



(en remplaçant évidemment ''http://www.chemin/vers/repertoire/ma-radio'' par le chemin qui correspond à votre installation !)



=== Dans un billet ===



(Par exemple pour une page connexe, mais ça marche aussi dans n'importe quel billet.)



Insérez un code identique à celui décrit pour l'insertion dans un widget. Si vous avez choisi la syntaxe wiki pour rédiger le billet, ajoutez **<nowiki>///html</nowiki>** au-dessus de la première ligne et **<nowiki>///</nowiki>** sous la dernière ligne :



<code html>

///html

<div>

  <object type="application/x-shockwave-flash" data="http://www.chemin/vers/repertoire/ma-radio/player_mp3_multi.swf" height="220" width="180">

  <param name="movie" value="http://www.chemin/vers/repertoire/ma-radio/player_mp3_multi.swf" />

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

  <param name="FlashVars" value="config=http://www.chemin/vers/repertoire/ma-radio/config_multi.txt" />

  <p>Lecteur mp3 en flash, merci <a href="http://resources.neolao.com/flash/components/player_mp3/templates/multi">Neolao</a></p>

  </object>

</div>

///

</code>







=== Ouverture en pop-up ===



D'abord, réfléchissez bien à votre décision. L'ouverture en pop-up est-elle vraiment nécessaire ? Ne va-t-elle pas gêner vos visiteurs plus qu'autre chose ? Envisagez aussi une solution médiane : offrir le lecteur directement dans la page **et** proposer dessous ou dessus un lien pour ceux qui préfèrent l'ouvrir en pop-up.



Pour faire ça proprement il va falloir bosser un peu.



Tout d'abord, vous devrez mettre dans votre espace web ((Je vous laisse choisir l'endroit le plus approprié en fonction de votre installation. Sous un blog Dotclear 2, dans un répertoire **js** lui-même placé dans le répertoire **public** n'est pas une mauvaise idée ; une autre option possible est de le placer dans le répertoire **ma-radio**.)) un fichier contenant les instructions en javascript. Dans notre exemple, on appelera ce fichier **popup.js** ([[:geekeries:kastafiore:details|détails et explications du fichier]]).



Dans le répertoire **ma-radio** ajoutez un fichier **index.html** //([[:geekeries:kastafiore:details|détails du fichier]])//



Dans la partie comprise entre les balises ''<head>'' et ''</head>'' de la page où vous poserez le lien vers la popup((C'est-à-dire pour les utilisateurs de Dotclear 1 dans **template.php** ; pour les utilisateurs de Dotclear 2 dans **_head.html**.)) ajoutez la ligne suivante :



<code html>

<script type="text/javascript" src="http://www.chemin/vers/fichier/popup.js"></script>

</code>



Puis, dans la page/ le menu / le billet, bref, là où vous le voulez, placez où vous le souhaitez le lien vers la radio sur le modèle de celui-ci :



<code html>

<p><a href="http://www.chemin/vers/fichier/index.html" class="popup">Ouvrir le lecteur dans un pop-up.</a></p>

</code>



Note : le script d'ouverture en pop-up se déclenchera au clic sur tout lien de la page portant la class ''popup''. Vous pouvez donc vous en servir pour d'autres liens. Toutefois, ces machins-là sont très agaçants, donc limitez-vous au strict nécessaire et tenez compte aussi du fait que comme le script fixe une taille de largeur et hauteur au popup, ça ne pourra pas servir à tout.



===== Remerciements =====



L'ensemble de cette documentation s'appuie très largement sur celle offerte [[http://resources.neolao.com/flash/components/player_mp3/templates/multi|sur le site de Neolao]] et à laquelle je vous invite à vous référer, ainsi qu'à son [[http://forum.neolao.com/viewforum.php?id=10|forum]], pour poursuivre vos personnalisations.