Ajouter des étoiles de cotations pour articles

Depuis quelques mois, Blogger avait introduit la possibilité d’ajouter des étoiles permettant aux lecteurs de coter les articles d'un blog quelconque hébergé sur la plate-forme.

Pour l’avoir sur son blog, il suffit de se rendre sur “ Mise en page ”, cliquer sur modifier pour l’élément “ Message de Blog ” (généralement au milieu et le plus grand de tous les éléments). Vous verrez dans la pop-up qui s’ouvrira la possibilité de cocher à côté des 5 étoiles pour les voir apparaître sur votre blog. N’oubliez pas de cliquer sur “ Enregistrer les modification ”.

Toutefois, si après avoir fait cela, les étoiles n’apparaissent pas sur votre blog, il vous faut aller sur “ Modifier le code html ” et là, cochez sur “ Développer des modèles de gadget ”.

1. Trouver la ligne de code suivante :

<div class='post-footer-line post-footer-line-1'>

ou trouver celle-ci :

<p><data:post.body /></p>

2. Juste après cette ligne de code (celle que vous aurez trouvé), mettez le code suivant :

<b:if cond='data:blog.pageType == "item"'>

<span class='star-ratings'>
<b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='180'/>
</b:if>
</span>

</b:if>

Ainsi, les étoiles apparaîtront seulement sur les pages d’articles. Si vous voulez que les étoiles apparaissent sur toutes les pages (accueil, libellés, archives), enlevez la première et la dernière ligne du code.

3. Ensuite, trouver cette ligne (un peu plus en bas) :

<b:include name='nextprev'/>

4. Après cette ligne, ajouter celle-ci :

<b:if cond='data:top.showStars'>
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
google.load("annotations", "1");
function initialize() {
google.annotations.createAll();
google.annotations.fetch();
}
google.setOnLoadCallback(initialize);
</script>
</b:if>

5. Enregistrer votre modèle et aller voir le résultat.

Une astuce de Blogger Buster.

@+