Créer un Blog avec Blogger

Intégrer Musique : Mp3 et Deezer

  Pour écouter et partager de la musique sur votre blog, vous avez plusieurs possibilités:
-si vous souhaitez écouter votre musique perso, vous devez stocker vos fichiers mp3  sur un serveur (le plus simple est d'utiliser l'espace d'hébergement fourni par votre FAI)
-Vous êtes utilisateur de Deezer ou Grooveshark et vous avez vos playlists, suivez le guide ci-dessous
-Vous utilisez un hébergeur spécialisé en musique comme  Tilidom (2Go de musique), suivez le guide ci-dessous
-Vous souhaitez utiliser un lecteur de musique fonctionnant  en arrière-plan pendant  les visites  de votre blog : utilisez PlayList. Suivez le guide ci-dessous
-Vous utilisez SoundCloud pour  écouter, télécharger de la musique, et vous souhaitez la partager sur votre blog. Suivez le guide ci-dessous

 

1-VOUS HEBERGEZ VOS FICHIERS MP3

Il faut stocker ses fichiers mp3 en ligne et avoir leur adresse URL exacte (en.mp3)
=>Attention : les fichiers stockés dans le Cloud (Google Drive, Dropbox, Hubic, Box, Onedrive...) même partagés, ne fonctionneront pas



  • Le plus simple : utiliser un espace d’hébergement web gratuit

    =>celui de votre FAI
    (comme Free, accès gratuit). Ouvrir votre espace, Utiliser  un logiciel de transfert FTP (Filezilla) pour créer des dossiers et transférer votre musique  ( et votre lecteur)

    Free propose à tous d'ouvrir un compte gratuit qui permet d'avoir accès à 10 Go pour héberger  site et fichiers.=> 
     S'inscrire ici

    Archive-Host (payant: 24€/an pour 5Go) permet des stocker des fichiers mp3 avec lien direct
  • Utiliser "Google site" mais  100 Mo de musique seulement !
Exemple sur "Google site" (et non pas Google Drive !)
https://sites.google.com/site/gillesbadufle/CESARIA%20EVORA%20_%20SENTIMENTO.mp3
voir ici comment faire
mais Quota du site : 100 Mo/site et Taille maximale des pièces jointes : 20 Mo

 

Comment faire ?

1- Faire un lien 

Vous pouvez faire un simple lien vers le fichier MP3
mais le lecteur s'ouvre seul dans une fenêtre.

2-Utiliser le Lecteur "dewplayer" avec fichier mp3 hébergé sur site perso

Alsacréations a développé divers modèles de "Dewplayer" c'est un lecteur mp3 sous licence CC que vous pouvez utiliser librement et gratuitement sur votre blog. Il est compatible avec tous les navigateurs (Internet Explorer, Mozilla Firefox, Opera, Apple Safari, Google Chrome, etc)




Le fichier Flash .swf est à placer sur votre site web (par FTP) avec les fichiers .mp3 (dans des dossiers ou non). Vous devez noter les adresses URL du lecteur et du fichier à lire.
Attention :
-utiliser des noms de fichiers mp3 sans majuscules, accents, espace...

-Mettre des Tags à vos Mp3 si vous voulez voir apparaître titres, interprète...

Ensuite vous devez coller ce code dans l'article de votre blog en mode HTML

 ---------------------------------------------------------------------------
<object type="application/x-shockwave-flash"
data="http://URL/dewplayer.swf"
width="220" height="20" id="dewplayer" name="dewplayer">
<param name="movie" value="http://URL/dewplayer.swf" />
<param name="flashvars" value="mp3=http://URL/son.mp3" />
</object>
--------------------------------------------------------------------------------------------------------------------------

http://URL/dewplayer.swf   ( 2 fois dans le code)  par votre adresse
http://URL/son.mp3 par votre adresse
-----------------------------------------------------------------------------------------------------------------------
Pour obtenir ces lecteurs
DEMO : cliquer pour écouter 
Mini


Classique


Lecteur incluant 3 titres


3- Utiliser un lecteur Google avec fichier mp3 hébergé sur site

Vous pouvez aussi utiliser une lecteur  Google en utilisant ce code dont il faudra changer uniquement l'adresse URL du Mp3
---------------------------------------------------------------------------------------------------------------------
<iframe style="width: 350px; height: 26px;"
src="http://www.gmodules.com/gadgets/ifr?
url=https://googledrive.com/host/0B4yfJJJSNrfubzJEUkxIYm1PcHM/google-audio-step.xml
&up_MP3=URL fichier mp3
&up_START=No
&up_CCOL=%23eeeecc"
allowTransparency="true" frameborder="0" scrolling="no"></iframe>
-----------------------------------------------------------------------------------------------------------------------
Lecteur



2-VOUS UTILISEZ DEEZER 

Il vous faut un compte Deezer, et donc, si ce 'est pas le cas, vous inscrire.
 

Une PLAYLIST
Créer ensuite une playlist que vous souhaitez diffuser sur votre blog
Ensuite cliquer sur PARTAGER


Puis sur la nouvelle fenêtre cliquer  en bas,  à droite sur
pour obtenir une nouvelle fenêtre avec,
d'abord la configuration



en bas le code:
vous devez coller ce code sur votre article en mode HTML pour obtenir ceci, en mode basic (qui est configurable)
DEMO : cliquer pour écouter

 
UN TITRE
sur Deezer, lors de l'écoute, cliquer sur
PARTAGER


INTEGRER

 COPIER LE CODE (en bas de la page)

 COLLER LE CODE dans l'ARTICLE en mode HTML
DEMO : cliquer pour écouter 




3-VOUS UTILISEZ GROOVESHARK
Grooveshark est un service d'écoute de musique en ligne qui, de plus,  vous permet de créer vos playlists, écouter des Webradios thématiques. Surtout vous  pouvez partager votre musique (morceau ou Playlist)

Pour ajouter GRATUITEMENT un lecteur intégrant votre playlist sur blogger, il faut : 
1° Aller sur le site de Grooveshark
2° S'inscrire. 
3° Créer une "Playlist" ou "Liste de lecture".
et ajouter vos morceaux (clic droit sur le morceau > Ajouter...)


4° Cliquer sur "Partager cette liste de lecture". 



5° Cliquer sur "Incorporer" pour obtenir le code. 



















6° Choisir les options (largeur, hauteur...)
7° Copier le code (Ctrl+A puis Ctrl+C). 
8° Coller le code dans un article, une page statique ou un gadget du blog. 
9° Pour faire démarrer le lecteur automatiquement, changer (2 fois) "&p=0" en "&p=1". 


Pour changer de "Liste de lecture", corriger le numéro de la Liste de lecture ID=xxxxx
Pour obtenir :
DEMO : cliquer pour écouter 


blogger by Gilbad on Grooveshark


4-VOUS UTILISEZ TILIDOM
Tilidom vous autorise à stocker  gratuitement 2 Go de musique et surtout vous propose de la partager.
Voir ici les explications utiles pour débuter.
Ensuite,  il suffit de copier/coller le lien proposé qui contient un lecteur de musique dans votre blog (en mode html) pour obtenir : 

 

5-Vous utilisez PLAYLIST
Playlist édite votre choix musical sur votre blog, en arrière plan.  Ce lecteur de musique gratuit fonctionnera en arrière-plan pendant que  les visiteurs  seront sur votre blog. 

Le player s'intègre au dessus de votre blog



Voir l'article complet et les explications détaillées
 
 
6-Vous utilisez SOUNDCLOUD

Avec SoundCloud vous pouvez écouter de la musique, enregistrer des sons, télécharger vos fichers  mp3,  et surtout vous pouvez la partager sur votre blog


Voir l'article et les explications détaillées