Canalblog
Editer l'article Suivre ce blog Administration + Créer mon blog
Publicité
Just Blog IT
8 décembre 2004

Comment intégrer une radioblog à votre blog?


On me pose cette question assez souvent par eMail: comment faire pour intégrer une radioblog dans son site sous Canalblog?
Voiçi deux exemples d'intégration différente:

     
  1. Folkfurieuse: sur ce site la radioblog est directement encastrée dans la page d'accueil en bas dans la colonne de droite. Avantage: elle est immédiatement visible. Inconvénient: la fenêtre du lecteur musical est assez large et peut ne pas convenir à tous les templates de blogs et, de plus, dès lors que l'internaute quittera la page en question le flux audio sera interrompu.
  2.  
  3. Le Blog qui gratte: ici, la radio.blog est suggérée par la petite télécommande. Un clic dessus et la fenêtre du lecteur musical apparait en pop-up. Avantage: intégration plus facile et moins intrusive. Inconvénient: on peut passer à coté. (ce serait dommage du si bon Blues :-)

C'est ce second exemple qui nous interesse puisque nous souhaitons intégrer une radio.blog à un blog hébergé par Canalblog.
Il y a deux façons de procéder, une simple et une plus compliquée chacune avec des avantages et des inconvénients:

Méthode rapide:

     
  1. Aller dans l'espace d'édition de votre blog.
  2.  
  3. Sélectionnez "Contenu"
  4.  
  5. Dans le champ "nom du site": indiquez "Radio.blog"
  6.  
  7. Dans le champ "adresse Internet", indiquez l'adresse de votre radio.blog là ou elle est hébergée, cette adresse est du type: "http://nomduserveur.fr/radio.blog/index.php"
  8.  
  9. Ajouter ensuite "une nouvelle catégorie": "A ecouter" (par exemple, ou "A ne pas écouter":-). L'important est de faire commencer le nom de cette catégorie par un ensemble de lettre lui permettant de se placer en tête de votre liste de liens externe car cette liste est classé alphabétiquement.
  10.  
  11. Valider et c'est fini.

L'avantage de cette méthode rapide c'est d'être rapide. L'inconvénient c'est que le lien vers la radio.blog n'est pas trés visible. De plus une fois cliqué c'est une nouvelle fenêtre qui s'ouvre en pleine page ce qui efface votre blog et il est donc impossible de naviguer sur votre blog tout en écoutant la radio.blog.
Pour rémédier a cela il y a la seconde solution, plus complexe mais aussi plus efficace.

Méthode élaborée:

     
  1. Télécharger radio.blog et l'installer en suivant la notice de l'application;
  2.  
  3. Aller dans la zone d'édition de son blog, sélectionner "Apparence" puis cliquer sur "Paramètres" et ensuite cocher la case "Convertir le modèle" si ce n'est pas déjà fait. ATTENTION: une fois le modèle converti il sera impossible de revenir au modèle paramétrable intuitivement, toute modification des templates se fera alors dans le code. La solution c'est de créer un second modèle qui permettra de conserver à part cotre modèle initial. C'est sur ce second modèle que se feront les modification et les tests.
  4.  
  5. Cliquer sur "Editer les fichiers de ce modèle"
  6.  
  7. Coller la ligne de code suivante juste sous la balise nommée :
  8. <div class="title">A écouter</div>
    <ul><li><a href="http://www.monsite.com/radio.blog/index.php?autoplay=0" onClick="window.open(this.href, 'Radio blog', 'width=220, height=340, location=0, resizable=0, scrollbars=0, status=0, toolbar=0, directories=0'); return(false);"><img src="http://cheese.canalblog.com/_Users_guillaumedevaux_Desktop_radiof.png" width="166" height="40" border="0"></a></li></ul>


  9. Remplacer  "www.monsite.com" par l'adresse de votre serveur.
  10.  
  11. Sauvegarder la page ainsi modifié en cliquant sur "Valider"
  12.  
  13. C'est fait, pas de 7éme étape, votre radio.blog apparait désormais sous le calendrier.

Note pour la 4éme étape: cette ligne de code pointe vers une image hébergée sur le serveur justblogit.free.fr. Si cette image venait à être effacée elle n'apparaitrait plus sur votre blog. Le mieux est de télécharger l'image, de l'installer sur votre serveur dans le dossier radioblog et de pointer dessus en modifiant la ligne de code verte.

Découvrez comment gagner de l'argent grâce à la publicité en ligne: Yoozbox.com

>> Suite du tutoriel par ici

Publicité
Commentaires
P
Oh le bel article. Merci
Répondre
L
Mais toujours d'actualité. Génial.
Répondre
P
Voila un bon article. Merci à vous.
Répondre
M
Bon bah j'ai plus qu'a essayer... merci encore pour votre aide
Répondre
R
je veut savoir comment mettre de la musique dans mon blog
Répondre
Publicité
Publicité