Version de base, lecture non automatique ; cliquer donc pour écouter !

 
On m'a demandé comment installer du son ou de la musique sur son blog.

Je vais vous faire une réponse de normande : ça dépend !

Et oui, ça dépend de votre hébergeur de blog et des associations qu'il a faites ou pas avec des sites de musique.


1. La musique avec Over-blog

Pour Over-blog, c'est facile d'installer un lecteur avec Deezer et ça marche très bien. Je ne vais pas vous expliquer comment tellement c'est simple : vous avez le bouton qui va bien dans la barre de menu au dessus de votre article en préparation.


2. La musique et/ou vos sons avec n'imperte quel hébergeur de blog

Sinon, voici une façon de faire indépendante de votre hébergeur, et qui permet, en plus, de faire écouter à vos visiteurs vos propres sons ou musiques.


3. Comment insérer votre musique ou votre son sur votre blog

Tout d'abord, il vous faut enregistrer votre son en format "son" : mp3, par exemple, sur un site d'archive.

Je vous ai déjà parlé d'Archive-host.

Je vous recommande de vous y inscrire (c'est gratuit) et d'enregistrer votre musique dans vos fichiers.

Une fois que c'est fait, ils vous fournissent directement le code à mettre sur votre blog, en mode avancé, bien sûr !


4. Les choix possibles pour mettre de la musique ou du son sur votre blog

Vous avez même le choix entre plusieurs lecteurs :

Je vous les montre :

* Celui en haut de mon article est le + simple, sans réglage de volume (ou peut juste le prendre en lecture auto ou non)

* Un autre ici, avec un autre son :

Lecteur MP3 avec curseur de volume

* Un dernier, toujours avec un autre son

Lecture non automatique, lecteur JW MP3 media playeur

Sinon, on peut avoir une version simplifiée du Drewplayer, en allant ici : Ajouter un son avec Drewplayer

* 5 articles a lire pour demarrer votre blog * Initiation au langage HTML * Tout pour modifier et embellir vos textes * Tout savoir sur les images  * Des gadgets * Votre blog ne ressemblera pas aux autres * Mes astuces * Référencements et indexations * Index des articles

Parfois, le webmaster d'un blog souhaite pouvoir être contacté autrement que via les commentaires déposés sur son blog.

Par contre, il ne veut pas pour autant donner son adresse mail à ses visiteurs. Il va donc falloir créer un lien de "contact".

 

1. Récupérer l'adresse de votre page "contact"

Sur Overblog, vous trouvez votre page "contact" :

* Complètement en bas d'écran, juste à droite de "Créer un blog sur over-blog"

* Ou dans votre module "Présentation", que vous trouvez dans votre administration en choisissant Configuer > Mise en Page > Module "Présentation"

En cliquant sur ce lien, vous arrivez sur votre formulaire de contact. Son adresse se trouve en haut de la fenêtre.

Pour moi, c'est :

http://ann.over-blog.com/blog-contact.php?ref=2012337


2. Mettre cette adresse en lien

2.1 Lier cette adresse à une phrase

* Choisissez la phrase, taper la en mode normal, puis, passer en mode avancé

* Ajouter avant <a href="Adresse de votre page contact">Phrase de contact</a>

et personnaliser avec votre adresse et votre phrase

2.2 Exemple de proposition de contact avec lien

<a href="http://ann.over-blog.com/blog-contact.php?ref=2012337">Un Clic ici pour me contacter</a>

donne :

Un Clic ici pour me contacter

2.3 Emplacement

Ce texte est à placer dans un module visible pour vos visiteurs, quelque soient les pages visitées.

<img src="http://sd-1.archive-host.com/membres/up/42016049459753927/belgica.gif">

Code HTML complet du drapeau animé avec lien vers traducteur français/néerlandais

<div style="text-align: center;"><a onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=fr%7Cen&amp;hl=fr&amp;ie=UTF8'); return false;" rel="nofollow" target="_blank"></a><a onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&amp;langpair=fr%7Cnl&amp;hl=fr&amp;ie=UTF8'); return false;" rel="nofollow" target="_blank"><img height="31" width="47" src="http://sd-1.archive-host.com/membres/up/42016049459753927/belgica.gif" alt="nederlands" title="Vertaal deze pagina in het Nederlands " style="cursor: hand;" /></a> </div>

Articles à relire

Mettre un drapeau animé traducteur de page WEB

Drapeaux traducteurs de page

* 5 articles a lire pour demarrer votre blog * Initiation au langage HTML * Tout pour modifier et embellir vos textes * Tout savoir sur les images  * Des jeux * Des gadgets * Votre blog ne ressemblera pas aux autres * Mes astuces * Référencements et indexations * Index des articles

Le principe de cet album est que vos visiteurs peuvent, s'ils le souhaitent, s'ajouter sur cet album en y mettant leur nom (ou pseudo), leur photo, leur localisation géographique et un petit message.

C'est très sympa, ce gadget permet de mieux connaître ses visiteurs, d'où ils viennent, et de mettre un visage sur un nom.

Testez-le en cliquant sur le bouton "Sign this guestbook" et vous apparaîtrez sur mon livre !

---

 

Vous le trouvez chez Slide, et il s'appelle "Guestbook".

1. Comment créer son livre d'invités :

Vous créez votre Livre d'invités en notant votre nom, en téléchargeant une photo, et en mettant une localisation et enfin un petit message.

Attention à vérifier qu'il "connaît" votre ville, sinon, il la remplace par San Francisco. j'ai eu ce problème, je me suis donc localisée dans la ville juste à côté...

Vous choisissez ensuite l'aspect de votre gadget :

   * votre décors,
   * vos effets,
   * son thème,
   * sa taille (3 possibles).

 Vous récupérez le code fourni, que vous copiez en format HTML là où vous voulez mettre le gadget.

* 5 articles a lire pour demarrer votre blog * Initiation au langage HTML * Tout pour modifier et embellir vos textes * Tout savoir sur les images  * Des gadgets * Votre blog ne ressemblera pas aux autres * Mes astuces * Référencements et indexations * Index des articles

Je vous ai trouvé le calendrier de Miss Univers 2010

Code HTML à copier pour isntaller ce calendrier sur votre site :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyODM3NjE3NTMxODcmcHQ9MTI4Mzc2MTc1ODA3OCZwPTIyMzA1MiZkPSZnPTEmbz*1Y2ZhYmQyOWFhMzY*NTlmOWQw/ODc3OWViNDkwZDAzZCZvZj*w.gif" /><embed allowScriptAccess="never" src="http://widgia.com/widgets/jimena_navarrete/jimena_navarrete.swf" quality="high" width="250" height="250"></embed><br /><a href="http://widgia.com" target="_blank">More calendar widgets at Widgia.com</a>

A lire aussi :

Mettre un calendrier animé sur son blog

Mettre une horloge sur votre blog

* 5 articles a lire pour demarrer votre blog * Initiation au langage HTML * Tout pour modifier et embellir vos textes * Tout savoir sur les images  * Des gadgets * Votre blog ne ressemblera pas aux autres * Mes astuces * Référencements et indexations * Index des articles