Soundmanager

Publié le : 19 juillet 2018 – Dernière modification le 4 mai 2021 – par BoOz – 29 commentaires

1
2
3
4
5
12 votes

Ce plugin permet la lecture et la mise en page de fichiers mp3 simplement en HTML / CSS.

Mise en plugin SPIP de la librairie Soundmanager2 de Scott Schiller.

Installation

Télécharger le plugin, puis ajouter des fichiers mp3 dans tmp/upload.

Associer les mp3 aux articles en utilisant les modèles.

Modèles par défaut

Le modèle emb de SPIP est modifié pour les mp3 et affiche un lecteur en HTML et CSS.

<emb1>

C’est le squelette inclure/player.html qui affiche ce lecteur HTML / CSS [1].

<INCLURE{fond=inclure/player,titre=#TITRE,url_document=#GET{mp3},duree=#GET{duree}}>

Les paramètres rgb, couleur et image sont également disponibles.

Mode liste de lecture

Si vos sons sont englobés par un élément HTML avec l’attribut data-playlist, alors à la fin d’un son, le son suivant se déclenche.

Exemple :

<div class="page" data-playlist>

...
</div>

Autres modèles

Le modèle doc_player affiche le lecteur HTML / CSS par défaut.

<doc1|player|rgb=217,214,233>

Le modèle doc_player360 affiche un lecteur HTML / CSS / SVG avec une vue à 360°.

<doc1|player360>

Le modèle doc_playerhtml affiche un lecteur HTML / CSS.

<doc1|playerhtml>

Contribuer sur SPIP-Zone

Pour modifier le plugin et faire profiter la communauté SPIP de vos améliorations (habillage graphique, nouveau modèle ou autre), vous pouvez utiliser votre accès à SPIP-Zone [2].

Pour récupérer les fichiers :

git clone https://git.spip.net/spip-contrib-extensions/soundmanager.git

Pour renvoyer sur SPIP-Zone les fichiers modifiés :

git commit -m "Message de commit décrivant la modification"
git push

Notes

[2] Si vous ne disposez pas encore d’un accès à git.spip.net vous pouvez en demander un sur la liste. Voir par ici

Discussion

5 ans 1 an 3 mois Sans limite
par date
Filtrer

10 discussions

  • Christian Julia

    Bonjour,

    J’utilise ce plugin pour insérer des versions sonores des textes de mon blog : https://www.christianjuliablog.fr/Pourquoi-l-ecologie-ne-fait-pas-recette.html et j’aimerais savoir combien de visiteurs écoutent ces audios. Est-ce possible ? Et si oui, quelle est la solution ? J’utilise le plugin Analyclick mais cela ne donne rien pour les documents.

    D’avance, merci.

    Répondre à ce message

  • 2
    Julie

    Bonjour,
    Dans le modèle audio_playerhtml.html,
    il semble il y avoir une fermeture de div en trop à la ligne 29 :
    <div class="loading"></div></div>

    Répondre à ce message

  • 9
    Dudule

    Bonjour,
    Est-il possible de lire des playlist avec ce plugin. Si oui, de quelle manière peuvent-elles être créées et intégrées au lecteur.

    Merci pour votre temps

    • BoOz

      Oui c’est possible en modifiant un peu la fonction jouer_son https://zone.spip.net/trac/spip-zone/browser/spip-zone/_plugins_/soundmanager/soundmanager.js.html?rev=110938#L60

      Sans tester je pense à quelque chose comme ajouter au début de la fonction jouer_son (première ligne) :

      // des infos sur le prochain son
var next_sound_id = media_id + 1 ;
var next_sound_url = $("a[data-soundId='"+ next_sound_id +"'][href$=mp3]").attr('href');

      Puis dans les propriétés de soundManager.createSound, après

      whileplaying:function(){
	...
}

      Ajouter :

      onfinish:function(){
	if(next_sound_id && next_sound_url)
		jouer_son(next_sound_id, next_sound_url);
}

      Si ca fonctionne comme ça ; ça vaudrait le coup de l’ajouter en commitant sur la Zone.

    • Jaseur Boreal

      Bonjour,
      Il y a parfois plus simple, selon l’origine des fichiers audios/vidéos.

      Soundsgood est un excellent outil pour faire connaitre une play liste quand les fichiers audios proviennent des habituelles plateformes de musiques.

      Exemple dans l’article d’un site spip sous Escal, avec la playliste du Pays qui chante : https://www.lettonie-francija.fr/1454 .

      J’ai débranché « Soundmanager » car je n’arrive pas à régler les dimensions de son affichage graphique, et voir mon message ci-dessous, le lancement du son ne se fait pas quand on utilise le modèle habituel

      <docXX>

      Cordialement

    • b_b

      C’est peut-être plus simple, mais ça te rend dépendant d’un service externe qui peut changer ses conditions d’utilisation du jour au lendemain, ou même disparaître :\

    • BoOz

      Voire revendre des informations personnelles te concernant à tout l’internet publicitaire et/ou sécuritaire.

    • Dudule

      Bonjour,
      J’ai modifié le .js selon les instructions et celui-ci ne génère pas d’erreur, c’est un bon début ... Sur la partie privée j’ai crée un article avec trois doc sur la partie publique j’affiche du coup trois lecteurs et sans playlist visible. J’ai dû manquer quelque chose dans la mise en oeuvre ... ;(
      Du coup je suis allé sur le site de soundmanager pour constater que le modèle Bar UI répond à mes attentes. Avant de me lancer sur le chemin hasardeux de l’adaptation de ce modèle, avez-vous déjà expérimenté son intégration dans le plugin ?

    • BoOz

      Ah oui magnifique ce Bar ui : http://www.schillmania.com/projects/soundmanager2/demo/bar-ui/

      Il faut l’ajouter au plugin de toute urgence.

    • tot44

      @Dudule
      Bonjour,
      Avez-vous réussi à adapter le modèle Bar UI ?
      Cordialement, Anthony.

    • BoOz

      Hello, le nouveau player passe au player suivant dans la page quand il a terminé un son.

    • BoOz

      Si toutefois il y a l’attribut data-playlist dans un parent des sons (div ou ul englobant la liste de sons).

    Répondre à ce message

  • 2
    DocDapertutto

    Cher.e.s toutes et tous
    Savez-vous s’il est possible de proposer de commencer la lecture d’un son à un temps t, et pas forcément au début ?
    Voire de proposer un chapitrage ? (un son, un lecteur, mais plusieurs chapitres, par exemple pour écouter une longue conférence en plusieurs fois ou aider à retrouver un passage qui intéresse plus particulièrement le visiteur) ?

    d’avance un grand merci

    Répondre à ce message

  • tot44

    Bonjour,
    Je me permets de relancer à propos de la playliste.
    Je galère à afficher un modèle utilisable.
    Oscillant entre Lecteur Multimedia2 et Soundmanager (dépourvu de modèle playliste).
    Avez-vous avancé avec le modèle Bar UI ? Je ne vois pas de traces sur le svn.
    Merci d’avance, Anthony.

    Répondre à ce message

  • jeanmarie

    Salut,

    j’ai créé un ticket sur la forge mais je double ici car je ne sais pas bien si il y a eu une notification :

    En SPIP 3.3, le modèle <docX> affiche le lecteur rond (vue à 360°) normalement réservé à <audioX> au lieu de la version par défaut (horizontale).

    J’imagine que c’est lié à la refonte des modèles document : https://git.spip.net/spip/medias/commit/fa13018a9ef63c633e78da253106867d6bac8a78

    Répondre à ce message

  • Yohooo

    Bonjour,

    Ce lecteur fonctionne avec de nombreux formats. Pourquoi le « brider » pour ne le faire fonctionner qu’avec du mp3 ?

    Répondre à ce message

  • 5
    André

    Bonjour,

    est-il possible de lire des mp3 distants avec ce plugin. Un spip 3.2.3 me pose problème pour ce type de lien.
    Exemple : http://www.petithan.be/spip/spip.php?article80
    Je vous remercie

    • BoOz

      Oui en utilisant le modèle <doc1> ou le document 1 est distant (avec une url).

    • André

      Bonjour et merci pour votre réponse. Quelle est la syntaxe à utiliser ?
      <doc1 [-->http://sffn.free.fr/mp3/queserais-je.mp3]> ne fonctionne pas...

      AP

    • BoOz

      Tu peux lire la documentation des modèles spip ici : https://www.spip.net/fr_article3454.html

    • Jaseur Boréal

      Bonjour,
      Dans Spip, depuis plusieurs années, avec ce plugin ou sans lui, car spip utilise l’insertion de fichiers médias, dont audios, il est possible d’incorporer un stream.mp3 dans une page article.
      Il suffit simplement :
      1. Enregistrer l’adresse du « fichier-stream.mp3 » dans un document Spip ajouté à la page article.
      2. Incorporer le document spip avec <docXX|player|center> ou avec <audioXX|center> maintenant.

      Et voilà c’est tout simple.
      @+

    • André

      En effet, c’est simple mais je n’avais pas compris au départ !
      Merci pour vos explications !
      Bàv
      André

    Répondre à ce message

  • 1
    Fennec72

    Bonjour,

    Un modèle de playliste d’un article, comme le modèle [(#MODELE{playliste}{id_article=XX})] du plugin « Lecteur Multimédia », est-il possible ?

    Merci d’avance,

    Cordialement,

    Hervé

    Répondre à ce message

  • Jaseur Boreal

    Bonjour,

    Il y a un problème.
    Le lancement du son ne se fait pas quand on utilise le modèle habituel

    <docXX>

    exemple à vérifier ici dans la page : https://www.lettonie-francija.fr/18
    Alors que le fichier s’écoute facilement avec le modèle

    <AudioXX>

    Un truc ? Un oubli ?

    Merci de vos suggestions

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom