Illustration sonore mp3

© Christian PAULUS. Document créé le 25 septembre 2008 , mis à jour le 17 avril 2009.

Quand un vieillard meurt, c'est une bibliothèque qui brûle. Diction africain

Accueil du site > Outils > Illustration sonore mp3

Plugin / SPIP 1.92, SPIP 2

Fond_MP3 (Fmp3) est un plug-in SPIP qui permet de jouer un son mp3 en guise d’illustration sonore pour un article, une rubrique, ou l’ensemble de votre site.

Avertissement

Fmp3 est un programme libre, vous pouvez le redistribuer et/ou le modifier selon les termes de la Licence Publique Generale GNU publiée par la Free Software Foundation (version 2).

Fmp3 est distribué car potentiellement utile, mais SANS AUCUNE GARANTIE, ni explicite ni implicite, y compris les garanties de commercialisation ou d’adaptation dans un but spécifique. Reportez-vous à la Licence Publique Générale GNU pour plus de détails.

Fmp3 est sous licence GPL/GNU. Ce n’est pas le cas des éléments qui l’accompagnent (Javascript et player flash). Il convient donc de lire les scripts concernés ou consulter les sites de leurs auteurs respectifs.

Les éléments qui accompagnent Fmp3 sont issus du site de Sean O.

Préambule

Fmp3 permet d’ajouter un fond sonore à un article, une rubrique, ou à l’ensemble de votre site. La mise en place d’un son ou d’une musique sur une page web n’est pas toujours souhaitable. L’ergonome vous sera d’un bon conseil. Lire le paragraphe des conseils si besoin.

Installation

Téléchargez l’archive de fond_mp3 disponible sur la zone.

L’installation nécessite de placer le dossier du plugin dans votre dossier plugins. Pour plus d’information sur l’installation d’un plugin, consulter cette page sur Spip.net.

Configuration

Dans l’espace privé, cliquez sur l’icône Configuration puis sur l’onglet « Illustration sonore ».

PNG

Définissez la configuration générale de Fmp3 puis validez.

PNG

Appliquer une illustration sonore à une rubrique ou un article

En espace privé, la boite « Ajouter un son à (une rubrique, un article) » vous permet de sélectionner le son mp3 pour cet objet.

Option ajouter une illustration sonore {PNG}

L’importation de votre illustration sonore mp3 réalisée, une nouvelle boite apparaît sur le côté gauche de votre espace privé :

Boite lecture d'illustration sonore {PNG}

Cliquez sur le bouton player pour écouter le son attaché.

Insertion de la balise ILLUSTRATION_SONORE

Pour activer l’affichage du player (le bouton qui permet de jouer le son mp3), vous devez insérer la balise ILLUSTRATION_SONORE dans vos squelettes. Le plus simple est de placer cette balise dans votre squelette « inc-pied.html ». Si vous utilisez la distribution par défaut de SPIP, ce squelette « inc-pied.html » modifié est automatiquement chargé.

Personnaliser l’affichage du player

Vous pouvez personnaliser l’affichage du player en créant les feuilles de styles nécessaires dans votre répertoire des squelettes. Il vous suffit de créer un répertoire « css » dans votre répertoire de squelettes, de recopier les fichiers « fmp3_public.css » et « fmp3_public_ie.css » dans ce répertoire et de les adapter à votre besoin.

Conseils

Placer une illustration sonore sur un site web peut-être un plus, mais attention à ne pas agresser votre visiteur par un son trop violent. N’oubliez pas qu’il est peut-être en train de visiter votre site dans un calme absolu et reposant. Evitez d’utiliser l’option « démarrage automatique » ou alors sélectionnez une musique douce qui démarre tranquillement. Si vous ne suivez pas les règles élémentaires de courtoisie, ne soyez pas surpris de voir votre visiteur fermer la fenêtre de votre site et retirer ce dernier de ses favoris.

Désactiver le plug-in

Fmp3 utilise la table SQL spip_meta de SPIP en y ajoutant un champ pour conserver en mémoire ses préférences.

Vous pouvez désactiver Fmp3 en décochant simplement sa case dans la boite de sélection des plugins. Vos préférences seront conservées.

Pour désinstaller Fmp3, cliquez avant tout sur la petite boite présente dans le champ, puis sur « Effacer tout ». Vos préférences liées à Fmp3 seront supprimées.

Test et validation

Testé et validé pour :
- Firefox 3.0.1 / Windows Vista
- Internet Explorer 7.0 / Windows Vista
- Opera 9.5.1 / Windows Vista

Tags:

Répondre à cet article

20 Messages de forum

  • Illustration sonore mp3

    28 janvier 2009 17:01

    Bonjour, Je suis sur SPIP2, j’active ce plugin qui fonctionne dans l’interface privée mais pas dans l’interface publique malgré la présence de la balise qui ne semble pas comprise (code conditionnel non affiché) Merci pour votre aide

    • Illustration sonore mp3

      5 février 2009 11:11, par lull

      Ce plugin semble me convenir parfaitement, mais je ne vois pas comment afficher le player en ligne. J’ai essayer avec ILLUSTRATION_SONORE dans l’article où je souhaite inserer le le lecteur (je ne sais pas trop à quel endroit insérer la balise exactement). Mais spip ne reconnait pas la balise apriori. Ça serait dommage d’avoir fait ce bon tutoriel, sans nous en dire d’avantage. Merci d’avance et bravo.

      • Illustration sonore mp3

        5 février 2009 14:25, par Christian PAULUS

        Edite le code source de la page et vérifie la présence de div style='text-align: left;' class='spip_code' dir='ltr'>code><!-- fmp3 -->de>/div> p>dans le head. p>Si ok, c’est que le plugin est activé correctement. Et si le player n’apparaît pas, c’est qu’il manque la balise.p>Si la balise est dans le squelette, il faut vider le cache et recharger la page.p>Bon courage.

  • même commentaire que les précédents : le plugin est bien actif (vérification faite dans le code source).p>Mais la balise #ILLUSTRATION_SONORE ne fonctionne pas. Ni dans une boucle article, ni dans une boucle document. Que faire ? Essais réalisés sue spip 2

    • Illustration sonore mp3 bug ou incompatibilité ?

      10 février 2009 11:34, par Christian PAULUS

      Ah ! En effet. Ca ne fonctionnait plus sous SPIP 2.0.3.

      Maintenant corrigé. (version 1.07)> erci.>

      • bonjour,

        - je voudrais savoir ou dans le squelette inc-pied il faut placer la balise ??
        - et quelle balise est ce ?? juste #ILLUSTRATION_SONORE

        je suis debutant et je n’y connait rien en balises ...

        merci beaucoup d’avance

        • Illustration sonore mp3 bug ou incompatibilité ?

          18 février 2009 09:34, par Christian PAULUS

          C’est écrit dans l’article :> code>Si vous utilisez la distribution par défaut de SPIP, ce squelette « inc-pied.html » modifié est automatiquement chargé./div> garde dans le dossier du plug-in. Il y a un fichier « inc-pied.html ». Ce fichier contient la balise en question. Si SPIP ne trouve pas de « inc-pied.html » dans le dossier des squelettes, ni dans un autre dossier de plug-in, c’est celui de fond-mp3 qui sera chargé à la place de la dist.

    • Illustration sonore mp3 bug !!!

      26 août 2009 01:22, par Oggiwan

      Il semble effectivement qu’il y ait plusieurs bugs sur ce plugin, au demeurant intéressant... en tout cas avec un SPIP 1.9.2i (je n’ai pas testé sur 2.0x). Voilà les corrections que j’ai apportées pour le faire fonctionner correctement :p>1- Le premier bug est dans la définition de la balise (dans "balise/illustration_sonore.php") :p>Le test (quand SPIP < 193) ne renvoie ni type d’élément (article/rubrique), ni identifiant, car ’a pas de clé "page", mais seulement : "articleXXX/rubriqueXXX", "date_redac", "date" et "id_article/id_rubrique". Ma modification (ajout commenté) recherche la clé qui contient "id_" pour trouver le type et l’id.tyle='text-align: left;' class='spip_code' dir='ltr'>mp3_spip_est_inferieur_193()) {nbsp;     $contexte = $GLOBALS['page']['contexte'];nbsp;     $objet = $result = "";nbsp;     if(isset($contexte['page']))nbsp;     { nbsp;             $objet = $contexte['page'];nbsp;             $id_objet = $contexte['id_'.$objet];nbsp;             $objet = substr($objet, 0, 3);
      nbsp;     }br />         else if(count($contexte) == 2) {/>                 $objet = "site";nbsp;             $id_objet = "0";nbsp;     }br />         else { // AJOUT POUR AVOIR "art" ou "rub" + idnbsp;             foreach ($contexte as $info=>$valeur) {nbsp;             if (preg_match("@^id_@",$info)) {nbsp;                     $objet = substr($info, 3, 3);
      nbsp;                     $id_objet = $valeur;br />                 }br />         } // FIN D'AJOUT br /> }/div>

      2- L’autre bug est dans le(s) javascript(s) ("javascript/jquery.fmp3.min.js" et "javascript/jquery.fmp3.js") ou dans l’appel de ces javascripts par "inc/fmp3_api_globales.php" :s "inc/fmp3_api_globales.php", le jQuery envoie le paramètre "autoStart" (lignes 223-236) :le='text-align: left;' class='spip_code' dir='ltr'>ument).ready(function(){bsp;     $(\"#fmp3-object\").jmp3({bsp;             playerPath: \"".$playerPath."\"bsp;             , mp3path: \"".$mp3path."\"bsp;             , showDownload: \"".$showDownload."\"bsp;             , autoStart: \"".$autoStart."\"bsp;             , backColor: \"".$backColor."\"bsp;             , frontColor: \"".$frontColor."\"bsp;             , repeatPlay: \"".$repeatPlay."\"bsp;             , songVolume: \"".$songVolume."\"bsp;             , width: ".$width."bsp;             , height: ".$height."bsp;     });> r dans "javascript/jquery.fmp3.min.js" et "javascript/jquery.fmp3.js", le paramètre attendu est "autoplay" (lignes 62 et 79 de "jquery.fmp3.js") :e='text-align: left;' class='spip_code' dir='ltr'>code>+ "&autoStart=" + options.autoplayt "d.autoplay" dans "jquery.fmp3.js")nommant soit "autoplay" en "autoStart" (ce qui me semble logique) dans les JS, soit l’inverse dans le PHP, le démarrage automatique fonctionne...vous modérez les messages, ne vous sentez pas obligés de publier ma réponse... Si vous la jugez intéressante, faites juste un correctif pour le plugin, c’est cela qui compte ! Et si vous voulez m’envoyer un courriel, n’hésitez pas...j’aurais juste une question : pourquoi n’envisagez-vous pas une méthode qui éviterait d’ajouter une balise au squelette ? Si le plugin est actif, ne serait-il pas possible de traiter tout en JavaScript dynamique généré par PHP ?nte de vous lire, et espérant avoir pu être utile...p>Oggiwan

      • Illustration sonore mp3 bug !!!

        26 août 2009 18:23, par Christian PAULUS

        Merci pour le compte-rendu. Je le poste qd même, ayant très peu de temps pour voir de plus près maintenant. Si quelqu’un a accès à la zone et du temps pour tester/valider ?

  • J’ai essayé ce plugin sur deux plateformes (windows et mac) avec firefox.> ur windows, le téléchargement d’un son fonctionne mais le bouton du player n’apparait pas dans la partie admin. p>Sur mac, le téléchargement fonctionne également, le bouton (noir) apparait bien sur la colonne de droite dans la partie admin.>Sur mac avec safari, le son est bien téléchargé et le player apparait dans la partie admin.is il y a un bug bloquant : toute façon, la balise #ILLUSTRATION_SONORE ne fonctionne pas sur le site public. Elle n’est pas calculée : il n’y a rien dans le code source.

  • Illustration sonore mp3

    1er novembre 2009 20:12, par Jérôme

    Bonjour,

    Le plugin correspond à ce que je cherchais. Après installation, et ajout de la balise #ILLUSTRATION_SONORE dans mon squelette, je n’ai rien qui apparait dans la partie publique. p>En privé, j’ai bien le lecteur et le son mais rien en publique : nilecteur, ni son. p>En lisant le forum, je vois que d’autres ont eu le problème. Est-ce que quelqu’un a trouvé une solution ?

    • Illustration sonore mp3

      2 novembre 2009 23:16, par Condorito

      Correction de l’autoplay js en autoStart (et oui, la majuscule compte pour beaucoup...grrrrr ;), tout fonctionne à merveille !!! Merci beaucoup pour la correction du script, vous êtes un chef !!!! Bonne soirée, Condorito

      • Illustration sonore mp3

        7 novembre 2009 11:30

        Bonjour, bon, je n’y comprend rien à rien. Comment mettre une balise, où, comment ???? Je vois bien dans la racine du site le inc-head et tout et tout, mais je ne sais pas quoi faire ??? Comment insérer la balise et où ?? Pour info, j’utilise spip 2.0.10p>Merci d’avance pour votre aide. CYrille.

    • Illustration sonore mp3

      9 décembre 2009 09:54, par Alain

      Bonjour,

      Après modification des scripts et fichiers, le bug reste intact, à savoir dans la partie privée cela fonctionne mais pas de musique lors du chargement de la page dans la partie publique... (j’ai fait attention à la majuscule).p>J’utilise spip 2.0.10 avec scolaspip.p>Cordialement.

  • Illustration sonore mp3

    13 décembre 2009 13:04

    Je confirme... Ce plugin est annoncé comme compatible avec spip 2 hors son objectif n’est pas atteind vu que rien ne s’affiche au niveau public. Ce plugin et marqué stable, il devrait plutot etre en dev car non terminé au vu des résultats sous spip 2 ou alors revoir la liste des versions compatibles.p>Une très bonne idée que ce plugin mais il reste important de revoir certaines choses avant de le déclaré compatible pour toutes ces versions et surtout stable alors que non terminé et propre. Si on développe un plugin, c’est bien dans le but de le rendre fonctionnel et accessible à tous, donc merci de donner de vraies informations relatives à sa stabilité et à sa compatibilité.