Magazine

Comment ajouter une évaluation d'article (star rating ou notification en étoile)

Publié le 18 juin 2009 par Toutegarnie
Comme vous l'aurez probablement remarqué, j'ai ajouté la possibilité d'évaluer un article. En effet, à la fin de chaque article, vous pouvez voter à savoir si vous détestez ou aimez l'article sur une base de 1 à 5 étoiles.
Il s'agit d'un petit service ajouté par blogger mais disponible que sur blogger draft.
Pour ceux qui ne le savent pas, blogger se présente sous deux plate-formes: la première, celle que tout le monde utilise, est la plate-forme originale, la deuxième, blogger draft, est là pour permettre aux gens de tester de nouvelles fonctionnalité. Et bien, la fonction "star rating" est offerte seulement sur blogger draft.
Cliquez sur blogger draft et loguez-vous simplement avec le même identifiant et le même mot de passe que blogger. Aller dans mise en page et cliquer sur modifier les messages. Vous n'aurez qu'à sélectionner "afficher les notifications en étoiles" et le tour est joué.
Prendre note que la notification en étoile n'apparaîtera que lorsque que vous cliquez sur un article pour le visionner... Pour qu'il soit vu à chaque page (comme dans mon cas) vous devrez modifier un peu le code HTML...
Vous voulez savoir comment?? Oui?? On commence...
  1. Allez dans modifier le code HTML
  2. Faites une sauvegarde de votre modèle (template)
  3. Sélectionnez "Développer des modèles de gadgets"
  4. Recherchez le code suivant: <span class="star-ratings">
  5. La ligne précédente devrait ressembler à ceci: <b:if cond="data:blog.pageType == "item">
  6. Effacez là, c'est cette ligne qui dit à blogger d'afficher le code seulement lorsqu'on clique sur un article...
  7. De plus, vous devrez effacer le code de fermeture suivant </b:if> qui se situe après le code de fermeture du </span>
  8. Et voilà!
De plus, j'ai aussi fait d'autres petites modifications... J'ai entouré le code <span> par un code <table> pour mettre un petit contour et j'ai ajouté les codes g:background-color='black' et g:text-color='99cc77' dans le <div> pour mettre le fond noir et les écritures vertes...
_____________________________________________
Vous aimerez sûrement ces articles:
Travailler en ligne, c'est possible!
Vous voulez vous débarrasser de la barre de navigation blogger?
La nouvelle Peugeot 3008, un métissage réussi!
Comment protéger ses photos sur son site web
Atlantis revient sur Terre suite à une maintenance sur Hubble

Retour à La Une de Logo Paperblog

A propos de l’auteur


Toutegarnie 8 partages Voir son profil
Voir son blog

l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte